javascript – print table from an array of defined size

Question:

<table border='1' id="tabela">
    <tbody>
    </tbody>
</table>

I would like to print differently

$(document).ready(function(){
    var i =0;
    while(i< 100){
        var resto = i%10;

        if(i%10 == 0){
            $("tbody").append("<tr>"); 
        }
        $("tbody").append("<td>"+i+"</td>"); 
        i++;
        //document.getElementById("tabela").innerHtml += "<tr><td>"+i+"</tr></tr>"; 
        if(i%10 == 0){
            $("tbody").append("</tr>"); 
        } 
    }    
});

actually, I wanted to print it this way:

[0][5][10][15][20]

[1][6][11][16][21]

[2][7][12][17][22]

[3][8][13][18][23]

[4][9][14][19][24]

how do I do?

http://jsfiddle.net/8Lnmtusf/

Answer:

I'm not good with JavaScript but I managed to come up with this solution, keeping in mind your claim that the table has a specific size:

$(document).ready(function(){
    var i = 0;
    var linha = 0;
    var id = 0;
    var pos = 0;
    while(i < 100){
      if(linha < 10) {
        $("tbody").append("<tr id="+id+"></tr>");
        $("#"+id).append("<td>"+i+"</td>");
        linha++;
        id++;
      } else {
        if(pos==10) {
          pos = 0
        }
        $("#"+pos).append("<td>"+i+"</td>");
        pos++;
      }
      i++;
    }
});

http://jsfiddle.net/n5oc52uh/

Scroll to Top