Определенная пользователем динамическая таблица jQuery

Question

Как я могу создать динамическую таблицу, когда пользователь вводит количество строк (количество тегов <tr>) и количество столбцов (количество тегов <td>)?

Я также должен убедиться, что каждый тег <td> имеет уникальный идентификатор.

HTML:

У меня есть в моем HTML код в <div id=tabel> ... </div>, где нужно вставить эту динамическую таблицу.

Javascript:

var rows = content.rows, colums = content.columns, size = colums * rows, i; 
$("tabel").append("<table>"); 

for (i = 0; i < size; i += 1) { 

// make table with dynamic <tr> and <td> 

} 

псевдокод или фрагменты кода поможет мне много!

Answer 1

Вам понадобится вложенный цикл. Петля строки затем внутри каждого контура строки в столбцы:

https://jsfiddle.net/g80hzjgn/2/

var rows, cols, domRow, domCol, 
    table = $('#table'), 
    cellId = 0; 

jQuery('#submit').click(function(){ 
    table.empty(); 
    rows = parseInt($('#row-input').val()); 
    cols = parseInt($('#col-input').val()); 

    for(var i = 0; i < rows; i++){ 
    domRow = $('<tr/>'); 
    for(var x = 0; x < cols; x++){ 
     domCol = $('<td/>',{ 
     'id': "cell-" + cellId++, 
     'text': 'cell' 
     }); 
     domRow.append(domCol); 
    } 
    table.append(domRow); 
    } 
});