Instead of using a table plugin by someone else, I choose to do it the standard HTML way of making Tables and rows etc etc. I would fetch data from a database to fill the rows. But when the number of rows exceeded 10,000, I realized I needed to lazy_load the rows otherwise the website would be incredibly slow. I've looked for ways to lazy load rows of a table, but I can't seem to find it anywhere, so my question is simply does the lazyloading plug-in or for rows even exist?
Hope some guru can answer this. Thanks in advance!
Background as to what I'm trying to do: I'm creating the rough sketch
of the table in the html code, then during runtime, I will add rows to
the table through DOM when the user searches for particular things.
When they search it, there will be thousands of results, and I want to
lazyload the result into the table.
jQuery provides lazyload for images and containers of images.
Some other plug-ins allowed for lazyloading of divs.
Lazyloading for table rows however seemed to be non-existant.
Some sample code for context:
HTML:
<fieldset>
<legend>PhotoViewer v1.6</legend>
<h4 id = albumName><i>Photos</i></h4>
<table cellspacing=1 border=2 id = photoTable class = lazyProgressiveLoad>
<tr style=font-style: italic; font-size: small; font-family: Segoe UI Light; color: Red>
<th>--Photo--</th>
<th>--Label--</th>
<th>--Path--</th>
<th><input type=button value=Add Photo onclick=addPhoto() id = addPhoto/></th>
</tr>
</table>
</fieldset>
Looking for some code that will allow the same functionality as the code below
for table rows.
Javascript:
$(function() {
$(img).lazyload({
effect : fadeIn
/*
,appear : function(elements_left, settings) {
console.log(appear);
console.log(elements_left);
//console.log(this, elements_left, settings);
},
load : function(elements_left, settings) {
console.log(load);
console.log(elements_left);
//console.log(this, elements_left, settings);
}
*/
});
});