Tuesday 13 March 2012

JQuery methods dose not work after calling any ajax event

After doing any event from any ajax controls i found that the JQuery code dose not work this is happening because of any Ajax event is removeing the scripts which is loaded at first time when we open the page,  so we need to load again each time the functions of the JQuery after each Ajax event.

Here below an example for what i did to fix these problem



$(document).ready(function () {

    EndRequestHandler();

});

function load() {
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
}

function EndRequestHandler() {

    $("#pHeader1").click(function () {
        $("#pBody1").slideToggle("slow");
    });


    $("#pHeader2").click(function () {
        $("#pBody2").slideToggle("slow");
    });

    $("#pHeader3").click(function () {
        $("#pBody3").slideToggle("slow");
    });
}

EndRequestHandler function is a function include inside it all the JQuerys calls and the function Load() where we add all the JQuery code again after firing any ajax event

No comments:

Post a Comment