Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

How to call a JavaScript function after an Updatepanel updated

Posted on 2010-08-27
2
Medium Priority
?
683 Views
Last Modified: 2013-11-11
I have an Updatepanel that covers 2 controls one of which is a Google map.  I need to update the data display on the map based on the what is in the other control which is a list.  In my code behind file I have a function to construct a string that draw the points on the map.  I debug the string and know that I get the map points correctly. To draw the map and the data on the page, I have a JavaScript function and I call that JavaScript function in my markup like so:

         <script type="text/javascript">
                  $(document).ready(load);
          </script>
                       
function load is defined in another JavaScript section.  The way I call the load function will just occur at the first time the page is requested and loaded.  When the Updatepanel on the page gets updated after a postback, that load function won't get call again to redraw the map.  

     How can I call that load function again after a postback for the Updatepanel or is there another way to call that load function after an initial load and after a postback?

Thank you.
0
Comment
Question by:lenguyen0366
2 Comments
 
LVL 3

Accepted Solution

by:
raaziq earned 2000 total points
ID: 33543858

<script language=javascript>
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

function EndRequestHandler()
{
          // Call the javascript function
}

....
</script>
0
 

Author Closing Comment

by:lenguyen0366
ID: 33553346
Hi raaziq,

    Your comment gives me a hint, I did try to go with your suggestion with some changes and it shows that it works.  I write a small test program with the map centered on different coordinates and couple of Next and Previous buttons on the same Updatepanel as the map so the buttons can cause the postback and the Updatepanel will update the map again with new coordinates by calling the load function.  Here is your suggestion with my changes.

<script language=javascript>
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(load);

//to draw the map
function load()
{

}

</script>

//In the markup where I call the load function to draw the map, I change to:

<script type="text/javascript">
        load();
</script>

Notice that I don't have
$(document).ready(load);
any more.  Also, in the add_endRequest handler, I call the load function directly and not going through another layer function of EndRequestHandler, although they should have the same effect.

    Thank you for your comment, it shows that this method works.

0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
Measuring Server's processing rate with a simple powershell command. The differences in processing rate also was recorded in different use-cases, when a server in free and busy states.
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

783 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question