After working the DOM for the past few days, I'm somewhat motivated to make my table row sorting demo support paging. In reality, it doesn't matter which table-sorting code I use, Erik Arvidsson has a nice example too. My logic is that I usually query a database and return all the rows for a particular table anyway, sometimes based on a search. Since I'm retrieving all these rows from the database, why not send them all to the UI. It might take a bit longer for the initial request, but then again, maybe not. I'm sure it's a different story for 10,000 records, but what if I only ever expect to have < 100 rows. Here's how I think I can do it:
1. Retrieve all the rows and put them in a table.
2. Call a JavaScript function on load that sets all <tr>'s (i.e. var rows = table.getElementsByTagName("tr")
) with a rowIndex > 20 to rows[i].style.display = "none"
.
3. When a user clicks on a page number, do the math and set rows[i].style.display=""
or rows[i].style.display="none"
to show/hide particular rows.
BTW, I've added support in my local copy of the sortTable.js
script to do sorting of <input> elements, as well as <select> elements. I can update the demo if anyone needs this functionality. Also, the W3C has a cool utility to check out what level of DOM support your browser has (based on user agent).
NOTE: I tried to manage my time today to be more productive, and succeeded at most things. I woke up at 3:30 this morning and got an hour and a half worth of editing done. I worked 8 1/2 hours at the office, and was home by 3:30. I was planning on working another 1 1/2 on editing, but it was a nice day so Julie, Abbie and I went on a hike at Red Rocks instead. I met a friend at 5:30 for an hour and a half of hoops, and returned home at 7:30. I got on this damn computer at 8:00 to do my evening editing, but instead ended up blogging and reading blogs for the last hour and a half. A month ago, I'd stay up late and still get my editing done. Not now, Abbie is much more fun and editing just doesn't sound interesting at all.
I feel the need to post a link to Matt Kruse's JavaScript Toolbox. I needed some JavaScript to move <option>'s from one <select> to another, and I found it via Google in about 10 seconds. I also use Matt's Calendar Popup JavaScript stuff, so his great work is familiar to me. To be fair and provide a fair shake to other great JavaScript libraries, here are a few others I've heard of and sometimes used:
If you know of others, please comment with links and your experience.