Saturday, May 1, 2010

Post Back from AJAX Update Panel

Recently, while working on a dev assignment I needed to make a complete post back (with page refresh) from a button control placed inside AJAX Update Panel. Exact problem was like this. There is a webpage on which I require AJAX functionality. Also, there is one button on whose click I want to make a post back. That button is also placed inside AJAX update panel and anything placed inside update panel by default does a Ajax callback. Sample web page is shown below:

image

Initially I thought of moving my Post Back Call button outside of AJAX update panel but that would have ruined my UI design. I was trying different options when I stumbled upon UpdatePanel’s child element <Triggers>. <Triggers> provides another child element <asp:PostBackTrigger /> with an attribute ControlID. We can specify from which control we want to make a post back call using this ControlID. Below code sample shows how to do this in ASP.NET.

image

This is quite simple to understand. Button btnPostBackCall will now make a complete call back. I recommend further reading on this topic from:

Currently Listening To: Heartbreak Warfare by John Mayer
~eNjOy~