I am trying to add a row to DataTable dynamically while specifying not only the data the table cell will hold but also the attributes <td>
tag will have.
right now i have this code
let row = [
'1',
model.name,
model.surname,
model.personal_id,
model.phone_number,
model.loan_total_amount+' '+model.currency_code,
model.loan_current_liability+' '+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();
I want to be able to do something like this
paymentsTable.row.add([
{ html : 'some html', className: 'some class', data-whatever:'whatever' },
{ html : 'some another html', className: 'some class', data-whatever:'whatever' }
])
In this case first cell in added row will have content of 'some html' class of 'some class' and data-whatever of 'whatever'
When you add a Row in datatable, you can get this new created row object
as follow:
var rowNode = oTable
.row.add([cellData, cellData, cellData, cellData, cellData, cellData])
.draw(false)
.node();
You can inject your CSS class
in desired td
of this new created row.
$(rowNode).find('td:eq(1)').addClass( 'myClass' );
$(rowNode).find('td:eq(3)').addClass( 'myClass2' );
See this JSFiddle Example for demonstration.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.