01.11.2005 - Insert Row Experiment
This latest experiment was written as part of a larger project that a co-worker needed a hand with. Picture a large table of songs, with columns for song title, track length, album name and a link prompting you to buy or download the song. Clicking that link set the display of a <tr> just below to "block" with links to get the song in multiple formats like MP3 or Ring Tone or even its Sheet Music.
The problem there is that each page had a very long list of songs, and the implemented method drasticly increased the size of the markup (to the tune of 130k) just to provide content that the user may not even see. I proposed doing away with the hidden rows all together and just inserting them as needed.
I'll not get into how the data is being parsed and served back to the user (I'd like to see an XMLHttpRequest implementation, but its not my project) but I will show you the row insertion stuff I came up with. It's nothing terribly fancy, but it took me a little while to figure out how to do it so I figured it might help someone out down the road somewhere.
Check out the insert row experiment.
As an aside - MSIE will not honor the colspan attribute applied via setAttribute (or as object.property) unless the "S" is capitalized, as in colSpan. That was quite a gotcha - not sure if it acts the same with other attributes or not, but that one kept me guessing for longer than I am willing to admit.
In our case, the groups of line below each grouping line is in a div, and we animate their appearance (using setTimeout, of course).
This was a redundant but a real eye-catching feature. You might want to try it yourself.
Posted by splintor on January 12, 2005 @ 8:20 am
Comments have been closed for this post.