By admin, posted on Nov 24th 2006
I had a quick though when waiting for different pages of a projectGenie pane. If you didn’t know (where have you been?) projectGenie allows you to view lists of information in neat little panes, and if there are too many items it paginates them, like this:
Each time a page number is clicked it loads the content for the new pane in the background using AJAX niftyness. It’s cool, it’s very web 2.0. And it can be really slow. So what’s the answer?
Well, as far as I see it if I can reduce the number of calls to the database while still providing the slick in-page pagination effect then that would be great. And I can, and here’s how.
Let’s say I load *all* the items in the list, yes, even if there’s 200 of them. Don’t worry, we’re not going to display them all, just fetch them. So we’ve got our recordset of 200 database rows, and we want to split them into neat pane-pages of 20 per page. Easy, we just set up a little function to group the records into a single <div> when they are fetched from the database into chunks of 20. Like so:
(For this example any code executed by the system is in [square brackets] and any HTML output is in green.)
[Fetch 200 records from the database]
Output the row details
If the counter has got to 20 then </div> <div>
So when we load all of this generated HTML into a content area we end up with something a lot like this:
So, it needs a bit of work but I like the idea of this.