JQuery and the update panel

If you're new to JQuery you'll no doubt have seen the various samples of code that tell you how to initialize a JQuery function or asset on page load, like this example using a datepicker:


$(function() {
$( "#datepicker" ).datepicker();
});


What they don't tell you is that this doesn't work properly if the page element on which the JQuery is acting is in an Update Panel control.

Fortunately there's a simple solution. Get a pagerequestmanager first, and use that to call the function. Again, the example is using the datepicker:


var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_pageLoaded(LoadMe);

function LoadMe() {
$( "#datepicker" ).datepicker();
});