Как добавить строку в таблицу, не используя тег <tr>? - PullRequest
Новая
       33

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

0 голосов
/ 22 декабря 2011

Я знаю, как добавить новую строку в таблицу, используя jquery. Самый простой способ сделать это - использовать теги <tr>: 

function insertRow(data, reportNumber) {  
    var guid = $(data).find('ID').text();  
    var portId = $(data).find('PortID').text();  
    var status = $(data).find('Status').text();  
    $('#gvwCashRegisterList').append(  
            "<tr class=\"cashRegisterRow\"><td><input type=\"checkbox\" value=\"" + guid +   "\"/></td><td>" + new Date().toLocaleString() + "</td><td>" + guid + "</td>  <td></td><td>" + reportNumber + "</td><td>" + portId + "</td><td>" + status + "</td><td><a   href=\"CashRegisterList.aspx\">Select</a></td></tr>"  
        );  
}

Есть ли какой-нибудь известный способ сделать это без использования тегов <tr>? Например: функции, плагины или библиотеки jQuery?

Ответы [ 3 ]

4 голосов
/ 22 декабря 2011

Только тег <tr> может генерировать строку таблицы в HTML - нет другого способа повторить их поведение с другим тегом в таблице.

Существует более удобный способ добавления строк таблицы: 

$("table tbody").append(
    $("<tr>") // create new tr element
        .attr("class","newTR") // set its class
        .append(
            $("<td>") // create a new td element within the tr
                .html("But this is new!") // set its content
        )
);

Пример .

Помните об отсутствии точек с запятой ; (например, после второй append() и html()).

2 голосов
/ 22 декабря 2011

Существует еще более понятный способ использования синтаксиса 1.4+: 

$("table").append(
    // create new tr element
    $("<tr></tr>", {
        "class": "newClass", // set its class
        html: $("<td></td>", { // create a td element within the tr
          text: "Table cell" // add text content
        })
    });
});

Теперь все аккуратно заключено в новый объект tr. Атрибуты и содержимое определяются во втором аргументе (литерал объекта), передаваемом методу $ ();)

0 голосов
/ 22 декабря 2011

В jQuery вы можете сделать это: 

$('<tr class="myclass" />')
    .append($('<td />').html('whatever here'))
    .appendTo('table');
...