Javascript/jQuery not Working Inside Updatepanel [Solution]

Leave a Comment
Question
When using JavaScript or jQuery in UpdatePanel enabled web page, everything will work fine at the first page load, but after any asynchronous post back happens by UpdatePanel, all JavaScript and jQuery effects will destroy.

Solution
UpdatePanels cause new elements to be placed in the page when they post back. It is no longer the same element so your bindings are not in place any longer. Otherwise for things, that fire once and fundamentally change the functionality of an item you need to fire some javascript once the new elements are loaded; all this requires is tying some javascript calls to a Microsoft provided call back function.

function FunctionName()
{
}
$(document).ready(function () {
FunctionName();
//again bind javascript function after asynchronous post back
var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(function () {
        FunctionName();
    });
});

0 comments:

Post a Comment