jQuery Datepicker OnSelect和TextChanged问题 [英] JQuery Datepicker OnSelect and TextChanged problem

问题描述

自从向我的Datepicker添加OnSelect以来，此控件不再触发TextChanged事件.我的代码如下:

$(function() {
    $("#<%=txtStartDate.ClientID %>").datepicker({
        minDate: 0,
        dateFormat: 'dd-M-yy',
        onSelect: function(dateText, inst) {
            var theDate = new Date(Date.parse($(this).datepicker('getDate')));
            $("#<%=txtEndDate.ClientID %>").datepicker('option', 'minDate', theDate);
        }
    });

    $("#<%=txtEndDate.ClientID %>").datepicker({
        dateFormat: 'dd-M-yy'
    });
});

<%-- etc ---- %>

<asp:TextBox ID="txtStartDate" runat="server" AutoPostBack="true" OnTextChanged="txtStartDate_TextChanged"></asp:TextBox>

我的其他datepicker(txtEndDate)TextChanged事件确实触发，因此只能将其放到为txtStartDate控件定义的OnSelect上.

非常感谢您对此提供的任何帮助.干杯！

解决方案

在对jQuery UI Datepicker源进行简短检查之后，解决方案是自己触发更改事件

...
onSelect: function(dateText, inst) {
    var theDate = new Date(Date.parse($(this).datepicker('getDate')));
    $("#<%=txtEndDate.ClientID %>").datepicker('option', 'minDate', theDate);
    if (inst.input)
        inst.input.trigger('change');
}
...

其原因是jQuery UI Datepicker源代码中的以下几行

if (onSelect)
    // trigger custom callback
    onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]);
else if (inst.input)
    // fire the change event
    inst.input.trigger('change');

如您所见，如果datepicker实例是input字段，则jQuery UI Datepicker会默认触发change事件，但如果您指定了自定义onSelect处理程序(如您所做的那样)，则不会触发它./p>

您可能会争辩说，实际上这是正确的行为，因为它可以确保您具有最大的可配置性.您可以决定是否希望change事件以这种方式发生.

但是我同意也许应该记录这种行为.

Since adding an OnSelect to my Datepicker, the TextChanged event no longer fires for this control. My code is as follows:

$(function() {
    $("#<%=txtStartDate.ClientID %>").datepicker({
        minDate: 0,
        dateFormat: 'dd-M-yy',
        onSelect: function(dateText, inst) {
            var theDate = new Date(Date.parse($(this).datepicker('getDate')));
            $("#<%=txtEndDate.ClientID %>").datepicker('option', 'minDate', theDate);
        }
    });

    $("#<%=txtEndDate.ClientID %>").datepicker({
        dateFormat: 'dd-M-yy'
    });
});

<%-- etc ---- %>

<asp:TextBox ID="txtStartDate" runat="server" AutoPostBack="true" OnTextChanged="txtStartDate_TextChanged"></asp:TextBox>

My other datepicker (txtEndDate) TextChanged event does fire so can only put it down to the OnSelect being defined for the txtStartDate control.

Greatly appreciate any help on this one. Cheers!

解决方案

After a short check of the jQuery UI Datepicker sources the solution is to just fire the change event yourself

...
onSelect: function(dateText, inst) {
    var theDate = new Date(Date.parse($(this).datepicker('getDate')));
    $("#<%=txtEndDate.ClientID %>").datepicker('option', 'minDate', theDate);
    if (inst.input)
        inst.input.trigger('change');
}
...

The reason for this are the following lines in the jQuery UI Datepicker source

if (onSelect)
    // trigger custom callback
    onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]);
else if (inst.input)
    // fire the change event
    inst.input.trigger('change');

As you can see jQuery UI Datepicker fire the change event per default if the datepicker instance is an input field but doesn't fire it if you specified a custom onSelect handler (as you did).

You could argue that actually this is the correct behavior as it guarantees you maximal configurability. You can decide if you want the change event to happen or not this way.

But I agree that this behavior maybe should be documented.

这篇关于jQuery Datepicker OnSelect和TextChanged问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！