One of my projects contains a couple of summary pages which take some time to collect their data. Originally, the ASPX page contained a set of GridViews displaying the result of different database queries, and I wanted to make the page more responsive by moving the GridViews to separate aspx files using iframes.
While this worked in principle, it did not work out in the details: paging and sorting via postback would always generate a full postback to the parent page. A question on Stack Overflow tells me I am not the only one with the problem.
Search the intertubes resulted in a project called UFRAME, which is hosted on codeplex:
UFrame combines the goodness of UpdatePanel and IFRAME in a cross browser and cross platform solution.
Instead of an iframe, the developer creates div’s with a non-standard src attribute. The UFRAME library scans through all these div’s, retrieves the HTML contents of the referenced ASP.NET URL, and merges its controls into the div using a bit of JavaScript magic. A detailed description can be found on the author’s codeproject page.
I needed to fix two problems, though:
The HTML parser throws an exception with pages containing a <meta http-equiv> attribute. This can be fixed by editing the regular expressions in htmlparser.js and replacing \w+ with \w+(-\w+)? in the startTag and attr regexes.
Next, UFRAME does not handle link targets: Every link is redirected to load the referenced URL into the containing div using the UFrameManager.loadHtml() function.
I changed the .click() function by replacing the call to loadHtml() with “return true;”, so that the links would open in the window containing the div.
