Thursday 23 July 2015

JQuery and UpdatePanel issue in ASP.Net

This is a regular issue for all developers who are using UpdatePanel in their code. If you are the one using JQuery functionality inside an update panel then first time the client side script works. But If any async postback happened, then after that JQuery will not work. This is because UpdatePanel do partial postbacks, so it will not reload the JQuery script to execute. So when you try to execute the script after postback it will give you 'undefined' error.

To solve this you need to call the same functionality in the endRequest.

How to do it.

     var initialise = function () {
           $(function () {
               doSomething();
           });

           if (typeof (Sys) !== 'undefined') {
               Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender, args)             {
                   if (args.get_error() == undefined) {
                       var responseText = args.get_response().get_responseData();
                       doSomething();
                   }
               });
           }

           return _this;
       };

I am calling my doSomething method in the initialise and in Sys.WebForms.PageRequestManager.getInstance().add_endRequest as well. So for partial postbacks the script will load again.

Hope this helps...... Happy coding :)

No comments:

Post a Comment