Question

我正在尝试动态地向DataTable添加一行，同时不仅指定表格单元格将保存的数据，还指定<td>标记所具有的属性。

现在我有了这段代码

let row = [
        '1',
        model.name,
        model.surname,
        model.personal_id,
        model.phone_number,
        model.loan_total_amount+'&nbsp;'+model.currency_code,
        model.loan_current_liability+'&nbsp;'+model.currency_code,
        model.pay_date,
        model.transaction_id || '',
        statuses[model.status],
        `<ul class="icons-list">
            <li class="dropdown">
                <a href="datatable_basic.htm#" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-menu7"></i></a>
                <ul class="dropdown-menu dropdown-menu-right">
                    <li><a href="datatable_basic.htm#"><i class="icon-paperplane"></i> send sms</a></li>
                    <li><a href="datatable_basic.htm#"><i class="icon-diff-removed"></i>mark as payd</a></li>
                </ul>
            </li>
        </ul>`
    ];

    let node = paymentsTable.row.add(row).draw();

我希望能够做到这样的事情

paymentsTable.row.add([
   { html : 'some html', className: 'some class', data-whatever:'whatever' },
   { html : 'some another html', className: 'some class', data-whatever:'whatever' }
])

在这种情况下，添加行中的第一个单元格的内容为“某些html＆＃39;一些班级＆＃39;和数据 - 无论是什么＆＃39;

Answer 1

在数据表中添加行时，您可以按照以下方式获取新创建的row object：

var rowNode = oTable
      .row.add([cellData, cellData, cellData, cellData, cellData, cellData])
      .draw(false)
      .node();

您可以将CSS class注入此新创建的行的所需td。

$(rowNode).find('td:eq(1)').addClass( 'myClass' );
$(rowNode).find('td:eq(3)').addClass( 'myClass2' );

请参阅此JSFiddle Example进行演示。

使用自定义属性标记向DataTable添加行

1 个答案: