Monday, February 07, 2011 #

Setting jQuery after ASP.net AJAX partial post back

OK, so for some reason you have a mega mashup solution with ASP.net AJAX, jQuery and web forms. 

Perhaps you are just on the migration from AjaxControlToolkit to the jQuery UI framework – who knows!!

Anyway, the problem is that when you post back with something like an UpdatePanel, you will find that your nicely setup jQuery stuff, like the datepicker for example will no longer work.

You may have something like this…

  1. $(document).ready(function () {
  2.     $(".date-edit").datepicker({ dateFormat: "dd/mm/yy", firstDay: 1, showOtherMonths: true, selectOtherMonths: true });
  3. });

 

When you’re ASP.net UpdatePanel post back, you will find that your datepicker has gone.  Bugger!

Well you need to add this little gem to set it back up again once the UpdatePanel comes back to the page.

  1. var prm = Sys.WebForms.PageRequestManager.getInstance();
  2. prm.add_endRequest(function () {
  3.     $(".date-edit").datepicker({ dateFormat: "dd/mm/yy", firstDay: 1, showOtherMonths: true, selectOtherMonths: true });
  4. });

 

Or like me, you would have a javascript function, something like InitPage(); do all your work in there and call that on document.ready and endRequest.

Your choice…you have the power Smile

 

Share this post :

Posted On Monday, February 07, 2011 2:26 AM | Feedback (2)

Copyright © Steve Clements

Design by Bartosz Brzezinski

Design by Phil Haack Based On A Design By Bartosz Brzezinski