pulverize pulverize - 1 year ago 58
Ajax Question

How can I load a WebForms page into an iframe without two full page renders from the server?

I have a sort of shell page that contains filter controls and an iframe for displaying a gridview. When you click the 'filter' button, or when a timer is fired, filter data is collected from the filter controls and fed in the querystring to the gridview iframe, as shown:

var URL = "/mypage/gridview.aspx";
var dest = URL + '?' + getFilterData();
var frame = $('#gridiframe');
type: "HEAD",
async: true,
url: dest
}).success(function () {
frame.attr('src', dest);

My conundrum is this: the gridview can be very costly to render. It performs a HUGE database trip and this method is causing the page to be rendered twice. The first time, the client just looks at the header to make sure the user is authenticated (page returns HTTP unauthorized if session has timed out) and that all the parameters are in a good format. But I don't want to change the iframe source to show an error message, I just want to call loadError which basically just notifies the user what went wrong.

Is there anything I can do with the client code to populate my iframe in only one exchange with the server?

edit: thanks all for your input. At the end of the day, I hate webforms. End of story.

Ziv Ziv
Answer Source

Instead of querying the iframe's source URL in the ajax query, query a different endpoint that doesn't run the same DB query. You said it does two things, 1 validate the user's login token is still valid and 2 that the filter parameters are valid. Neither of those validation steps require running the query on the database that get the full query results. So, create a new API endpoint that does your basic validation, and if that returns a success message, then set the iframe source to what you want.

Another option is to return a HTML fragment, rather than a full HTML page, from gridview.aspx. Then your AJAX can replace the contents of a div with the HTML result if successful, rather than setting the iframe src, while still allowing you to handle errors.

A more trendy option (not saying it's better or worse, but certainly more aligned with the current web development industry) is to change gridview.aspx to a web service/api that returns the data in simplified json, then use a javascript framework, or template engine to generate the html table on the client itself.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download