 |
|
|
 |
|
Refresh An ASP.NET UpdatePanel From Another Window
|
by Jeffrey Dale Starr, MCSD
Here's a situation I faced the other day with an application I'm currently working on. I'm sure it's a fairly common scenario, so I decided to share the solution I came up with.
The Scenario: I have an UpdatePanel on a WebForm that contains a small DataView displaying the Reps assigned to a particular Order. There is a button that, when clicked, opens a Pop-Up Window containing a form that allows the User to search under various criteria and select a Rep.
This page was built in the pre-AJAX era, so naturally when the search window closes it fires off a JavaScript window.location method that causes a full PostBack on the original screen. Of course, now we simply want to refresh the UpdatePanel to display the newly selected Rep.
Step One: Attach A Hidden Button
I know there are other (maybe better) ways to do this, but in this particular case time was of the essence, so I needed a quick, reliable way to wire up the event I needed to call.
So this is what we have so far:
What's really nice about sticking the button within the ContentTemplate is we don't have to wire up any Triggers. Since the button is within the UpdatePanel, 2 things will happen: 1) Clicking the button with refresh the UpdatePanel and 2) the server-side event that is attached to the button will fire.
Note: The button style is set to "display:none". This allows the control to be rendered but not to affect our layout. That is important because we won't have any unwanted spaces but will still be able to find our control when the DOM needs to click it.
Step Two: Wire Up Server-Side Events
You'll notice that our code seems kind of minimal:
Again, this is another benefit of having the button within the same ContentTemplate as the GridView. Since our button click is going to refresh the UpdatePanel, we don't need to explicitly write pnlTest.Update(), because it is going to update automatically.
Step Three: Create The Client-Side Click Function
Now that I had the button on my main form successfully refreshing my UpdatePanel, the final step was to click that button with JavaScript on my popup window. Depending on your needs, you can put this code wherever it makes sense chronologically. In my case, I just wanted to refresh my Rep GridView after a new Rep was entered into my SQL Server database. So OnClose of my lookup window, I ran the following JavaScript:
The "top.opener" section of JavaScript refers to our main WebForm (which is great, since it keeps us from having to jump through hoops to find out where we came from).
Hope this little article helps you to save some time and add another arrow to your development skills quiver!
Jeffrey Dale Starr is CEO and President of Purple Falcon Inc, a software development company located in San Francisco.
http://www.purplefalcon.com/
|
|
|
 |