在UpdatePanel中使用JQuery UI日期選取器

Question

我想爲日期選取器使用UpdatePanel控件和Jquery UI。但是如果日期選取器控件（TextBox）在UpdatePanel的ContentTemplate中，那麼日期選取器不起作用。

下面是代碼：

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
    <script src="Scripts/jqueryui/js/jquery-ui-1.8.8.custom.min.js" type="text/javascript"></script> 

    <script language="javascript" type="text/javascript"> 

     $(function() { 
      var dates = $(" #txtDatePicker").datepicker(
      { 
       firstDay: 1, 
       maxDate: '-1y', 
       minDate: '-1y', 
       dateFormat: 'dd/mm/yy', 
       changeMonth: true, 
       changeYear: true, 
       showAnim: "drop", 
       onSelect: function (selectedDate) { 
        var option = this.id == "txtDatePicker" ? "minDate" : "maxDate", 
        instance = $(this).data("datepicker"); 
        date = $.datepicker.parseDate(
         instance.settings.dateFormat || 
         $.datepicker._defaults.dateFormat, 
         selectedDate, instance.settings); 
        dates.not(this).datepicker("option", option, date); 
       } 
      } 
      ); 
     }); 

    </script> 



    <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
    <ContentTemplate> 
    <asp:TextBox ID="txtDatePicker" runat="server"></asp:TextBox> 
    </ContentTemplate> 
    <Triggers> 
     <asp:AsyncPostBackTrigger ControlID="btnSomeButton" EventName="Click" /> 
    </Triggers> 
</asp:UpdatePanel> 

有沒有辦法使用的UpdatePanel裏面的內容JQuery用戶界面日期選擇器？

Answer 1

然後，您將控件放入面板中，它們可以更改它們的唯一ID。 嘗試一下本作代碼：

var dates = $("#<%= txtDatePicker.ClientID %>").datepicker( 

或代碼移到

$(document).ready(function() { 
    // Handler for .ready() called. 
}); 

也有一個空間到你的選擇：代替

var dates = $(" #txtDatePicker").datepicker(

：

var dates = $("#txtDatePicker").datepicker(

然後，使用的UpdatePanel和AJAX工具包，你應該在

function pageLoad() 
{ // MS AJAX - UpdatePanel initialize 
    InitializeDatePicker(); 
} 

在的UpdatePanel控件中

$(document).ready(function() { // jQuery 
    AssignFrameHeight(); 
}); 

對於外界的UpdatePanel控件的jQuery使用的初始化和。