How to get javascript to execute in update panel

Question

I have an update panel that contains a table to which I add rows of controls when I click a button. One of the controls that is added is a user control, and that is a date picker. There is a text box inside this user control, and I have jQuery that applies the JQuery UI DatePicker plugin to it, thereby turning it into a datepicker. This is not a problem if this user control is loaded onto the page dynamically, however, if it is done on asynchronous postbacks inside the update panel, javascript does not start, and therefore the text field is rendered, but without all the jqery datepicker functions. Here is the code that is inside DatePicker.ascx:

$(function() {
       //reset the localization
        $.datepicker.setDefaults($.extend($.datepicker.regional['']));
        $("#<%=txtDate.ClientID%>").datepicker({ dateFormat: 'mm/dd/yy', showOn: 'button', buttonImage: '/images/calendar.gif', buttonImageOnly: true, altField: '#<%=txtDate.ClientID%>' });

}

Thus, this jquery does not start when the control is loaded dynamically for async postback. So how can I do this job?

Answer 1

When you present a script in a response, it does just that: render the script. When rendering the page, the script is first displayed, and this has already happened by the time this code is executed.

Microsoft has developed a solution for this, which should register the script block through ScriptManager.RegisterClientScriptBlock, and the ScriptManager will ensure that the script runs after the page loads.

. : . , , , :

GetClientScript UserControl, JavaScript. UserControl , , script. UpdatePanel, ScriptManager . UserControl, script , .

Answer 2

DatePicker , ASP.NET AJAX UpdatePanel DOM, . , EndRequest, pageLoad, , javascript ScriptManager.

, .

Answer 3

DatePicker.ascx javascript ? , . datepicker async , .