jquery ui datepicker inside asp.net UpdatePanel
asp.net, asp.net-ajax, jquery, jquery-ui, updatepanel
Solution
add the script behind , that's what I do.
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(function(evt, args) {
$(".datepicker").datepicker();
});
</script>
Problem
I have a web page, where I'm using a jQuery UI datepicker on an asp.net textbox, which is located inside an UpdatePanel. Here is a description of what I do roughly ``` <script type="text/javascript"> $(document).ready( function() { $(".datepicker").datepicker(); } ); </script> <asp:UpdatePanel ... > ... <asp:TextBox runat="server" CssClass="datepicker" /> <asp:Button runat="server" /> ... </asp:UpdatePanel> ``` When I first load the page, everything works fine. When clicking inside the textbox, the datepicker pops up. But when I click the button, and an async postback is executed, the datepicker no longer pops up, when I click the field again. I know that the problem is because the UpdatePanel completely replaces all the contained HTML when it is updated, so in effect, it is a new text field, which has not been initialized with the datepicker functionality. I guess that I should not use $(document).ready() here to initialize my datepickers, but where is a good place to place the initialization code? Or is there a way that I can retrigger the initialization code after an AJAX update?