JQueryUI datapicker behavior when opened during ASP.NET partial postback: year becomes 1899 or 1900

I have a very interesting error with jQueryUI and UpdatePanel dumps, where the date of the date of the date selection is about 100 years. jQuery is version 1.6.2, and jQueryUI is version 1.8.14. Here's a rough outline:

<asp:UpdatePanel ID="myUpdatePanel" runat="server">
  <ContentTemplate>
    <asp:DropDownList ID="myDdl" runat="server" AutoPostBack="true">
      <asp:ListItem Value="foo" Text="Foo" />
      <asp:ListItem Value="bar" Text="Bar" />
    </asp:DropDownList>
    <asp:TextBox ID="myText" runat="server" CssClass="dateText" />
  </ContentTemplate
</asp:UpdatePanel>
<script type='text/javscript'>
  $(document).ready(function()
  {
     $('.dateText').datepicker({ changeYear: true, showButtonPanel: true, yearRange: '-2:+2' });
  }

  function pageLoad(sender, args)
  {
    if (args._isPartialLoad == true)
    {
      $('.dateText').datepicker({ changeYear: true, showButtonPanel: true, yearRange: '-2:+2' });
    }
  }
</script>

So, I have an UpdatePanel that contains a drop-down list that causes a postback when it changes, as well as a text field. I have jQueryUI setting a text box as datepicker. Please note: all this is contained in the jQueryUI modal dialog box.

So what happens:

  • When a dialog box opens, the default focus is the popup menu. Pressing a key on the keyboard will change the selection in the drop-down list, but will not initiate a postback.
  • . (- ), jQueryUI DatePicker ( 2012 ).
  • , , , - datepicker.
  • "/" datepicker. , 2010 . , 2010 .
  • . Datepicker . 4, 1899 . 4, 1900 .

, datepicker , , . , datepicker pageLoad.

, , $('.ui-datepicker-title').length datepicker pageLoad. , . , , pageLoad datepicker:

  • $('.dateText').unbind();
  • $('.dateText').datepicker('destroy');
  • $('#ui-datepicker-div').remove();

, , .

?

: jQueryUI 1.8.18 jQuery 1.7.1 ( ), .

2: , onChangeMonthYear, pageLoad. 1899 1900, datepicker (). , , ''. , datepicker .

, , , jQueryUI, , - .

3: ASP.NET 4, jQuery 1.7.2 jQueryUI 1.8.21. , , . jQueryUI. .

4: ASP.NET jsfiddle.

+5
1

jQueryUI, , , - . , , .

myInput:

var changingDate = false;
$('#myInput').datepicker({onChangeMonthYear:function(year, month, inst)
  {
    if (changingDate == false)
    {
      changingDate = true; //I set the date later which would call this
          //and cause infinite recursion, so use this flag to stop that
      if (year == 1899 || year == 1900)
      {
        var now = new Date(); //what the picker would have had selected
            //before clicking the forward/backward month button
        if (year == 1899) //I clicked backward
        {
           now.setMonth(new.getMonth() - 1);
        }
        else if (year == 1900) //I clicked forward
        {
           now.setMonth(now.getMonth() + 1);
        }
        $(this).datepicker('setDate', now);
      }
      changingDate = false;
    }
    }
  });

onChangeMonthYear, , pageLoad:

function pageLoad(sender, args)
{
  if (args._isPartialLoad == true) //called because of UpdatePanel refresh
  {
    //set up datepicker as shown above
  }
}
+5

All Articles