ali ali - 1 year ago 54
HTML Question

Generate Number of Column and Number of Rows on user input

How can I generate a table with number of columns and rows from user input?

I want to offer two input fields to the user for row and column numbers to create the table on a button click.

Answer Source

you can do it using a for loop for example

function createTable(r, c) {

  var tb = document.createElement('table');

  for (var i = 0; i < r; i++) {
    var row = document.createElement('tr');
    for (var j = 0; j < c; j++) {
      var column = document.createElement('td');
      column.appendChild(document.createTextNode(" row:"+i + " column:"+j));

  return tb;

here's a working fiddle

[EDIT] fiddle with inputs

[EDIT2] fiddle with text inputs on cells

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download