Filling a table with JavaScript -


i trying create table dynamically , fill rows specific number of cells, depending on width of viewport. want make sure it'll adjust whatever width of screen when page loads (so not regular screen sizes).

here have tried far, code within window.onload function:

javascript

        var table = document.getelementbyid('instagram_table_body');          /* number of elements per row */         var rowelems = math.floor(screen.width / 152);                      /* number of rows */         var rowcount = math.ceil(data.length / rowelems);          var globalcounter = 0;          (var i=0; i<rowcount; i++) {             var tr = document.createelement('tr');              (var j = 0; j < rowelems; j++) {                 var td = document.createelement('td');                 var img = document.createelement('img');                 var = document.createelement('a');                  a.href = data[globalcounter].images.standard_resolution.url;                  img.src = data[globalcounter].images.thumbnail.url;                  tr.appendchild(td.appendchild(a.appendchild(img)));                  globalcounter++;             }             table.appendchild(tr);         } 

the thing this code not output anything, , no tr actualy appended table body. i know data used there , valid (it's ajax call , showing in regular dynamic table works fine.

the issue seems child appending process or moment when append rows table, can't spot quite yet.

note: i'm trying efficient possible, that's main reason jquery isn't there. (it's actualy used $.get , $.post methods)

jsfiddle

if have less multiple of rowelems*rowcount items in data list, overrunning data array.

for example, let's have 7 items in array can fit 6 on screen. loop on elements [0-5], append them table object, , increase row count. then, you're looping on elements [6-11], array contains 7 objects.

you should see last table row failing display. if have 1 row in data set, you'll see nothing @ in table, since call table.appendchild(tr) never reached.

also, diodeus' comments wrt dom manipulation ones.


Comments