Thursday, October 20, 2011

calling Javascript methods on updatepanel events

Recently came up with a scenario where I need to call a Javascript function to update a label with client side time on auto save, while auto saving was working fine, the only issue was capturing the time, since the label was updated at server we would end up with server time, so the do get client side time the option is to call a JS function at end request of update panel now the problem, there are multiple update panels on the page how do we know which panel is called, after digging a lot, I fond this discussion on stack overflow http://stackoverflow.com/questions/338702/how-to-call-a-client-side-javascript-function-after-a-specific-updatepanel-has-b 


Code on stack overflow


$(document).ready(function() {
 panelsLoaded = 1;   Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(PageLoaded) 
 }); 


 function PageLoaded(sender, args) { 
   console.log("I have occured " + panelsLoaded++ + " times!"); 
   var panelsCreated = args.get_panelsCreated(); 


   for (var i = 0; i < panelsCreated.length; i++) { 
     console.log("Panels Updating: " + panelsCreated[i].id); 
   } 
  var panelsUpdated = args.get_panelsUpdated(); 


 for (var i = 0; i < panelsUpdated.length; i++) { 
 console.log("Panels Updating: " + panelsUpdated[i].id); 
 } 
 } 


My Modified version 


$(document).ready(function () {        Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(PageLoaded) 
 }); 


function PageLoaded(sender, args) { 
  var panelsUpdated = args.get_panelsUpdated(); 


  for (var i = 0; i < panelsUpdated.length; i++) { 
     if(panelsUpdated[i].id == "<%=UpdatePanel2.ClientID%>") 
                 alert('timer called');                     
         } 
     } 
 } 


This enabled us to call timer string update after isolating the update panel, we thanks james for sharing this code, in the first place. Hope this is useful to you, please give your comments and share this article if you do.




Hold Up


kick it on DotNetKicks.com

No comments: