Creating Html table using a loop

Please help with the below scenario ->

I need to display values ​​from 1 to 30 in a table in such a way that nos 1,2,3 come in one tag and like wise 4,5,6 in other tr tags and so on up to 30 values. I want to use a table to display values ​​in a table element. in which each value like "1" should appear in one, "2" should not appear in different <TD>

, etc.

What I mean is that the value "1" should appear in one tag <TD>

tag <Table>

, the value "2" should appear in another tag, <TD>

and so on. Also after three subsequent ones, <TD>

one <Tr>

should be used. The output should be as follows: →

1 2 3 
4 5 6
7 8 9

      

etc.

An early reply would be much appreciated. Thank.

I have tried the code given below,

<script type="text/javascript">

    document.write("        <table width='673' align='center' cellpadding='2' cellspacing='1'>");
    document.write("            <tr>");
    document.write("    <td valign = 'top'>");
    document.write("                </td>");

    document.write("            </tr>");

    var cnt = 0;
    for (var idx = 1; idx <= 30; idx++) 
    {
        cnt = cnt + 1;
        document.write("            <tr>");
            document.write("    <td valign = 'top'>");
            document.write("        <table width='100px' align='center' cellpadding='2' cellspacing='1'>");
            document.write("            <tr>");
            document.write("                <td align='center'>");
            document.write("                   " + idx + "");
            document.write("                </td>");
            document.write("            </tr>");
            document.write("            <tr>");
            document.write("                <td class='label'>");
            document.write("                    <span> name part : " + idx + "</span>");
            document.write("                </td>");
            document.write("            </tr>");
            document.write("            </table>");
            document.write("                </td>");
            if (cnt = 3) 
            {
                document.write("            </tr>");
            }
            if (cnt = 3) {
                cnt = 0;
            }

        }

    document.write("            </table>");
</script>

      

+3


source to share


3 answers


You can try something like this:

var mytable = "<table cellpadding=\"0\" cellspacing=\"0\"><tbody><tr>";

for (var i = 1; i < 31; i++) {
  if (i % 3 == 1 && i != 1) {
    mytable += "</tr><tr>";
  }
  mytable += "<td>[" + i + "]</td>";
}

mytable += "</tr></tbody></table>";

document.write(mytable);

      



Here is a jsFiddle demo

+8


source


This is untested psuedo code, but might help you get started:

var x, row;
for(x=1;x<10;x=x+row)
{
    document.write('<tr>');
    for(row=0;row<2;row++)
    {
        document.write('<td>' + (x + row));
        // Whatever else you want to output
    }
}

      



Edit: This answer was given before the OP edited his question to add more information.

+1


source


Use modulo operator% to check 3rd number and set tags accordingly.

http://en.wikibooks.org/wiki/C_Sharp_Programming/Operators

0


source







All Articles