jquery accordion not re-initiating after an asp.Net postback

I’m firing up a jquery accordion with:

$(document).ready(function(){
   $('#accordion').accordion();
});

Problem is this is an .asp.NET application and if the page fires a postback is destroys the accordion. How do I re-initiate the accordion upon postback?

Sorry I’m not an expert on asp.NET, and also sorry I can’t give you a link to the example, this is because it’s a password protected application.

Thanks.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

You need to re-initlaize the accordion after the post back with the UpdatePanel functions as:

<script type="text/javascript"> 
$(document).ready(function(){
    var prm = Sys.WebForms.PageRequestManager.getInstance();    
        prm.add_initializeRequest(InitializeRequest);
        prm.add_endRequest(EndRequest);
   // on page ready first init of your accordion
   $('#accordion').accordion();
});


function InitializeRequest(sender, args) {      
}

function EndRequest(sender, args) {
     // after the UpdatePanel finish the render from ajax call
     //  and the DOM is ready, re-initilize the accordion
     $('#accordion').accordion();
}
</script>

Relative:
Asp.Net UpdatePanel in Gridview Jquery DatePicker
ASP.Net : Need to run javascript on update panel load completed
How do you get client-side script to execute on an ASP.NET postback? (from an UpdatePanel)

Method 2

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(InitAccordion);
function InitAccordion(){       
   $('#accordion').accordion();}

This will work for postback and asyncpostback
Raised after all content on the page is refreshed as a result of either a synchronous or an asynchronous postback.
http://msdn.microsoft.com/en-us/library/bb397523(v=vs.100).aspx


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x