javascript - Child row datatables - row data value undefined -
i have datatable child rows populated following function:
$('#mydatatable tbody').on('click', 'td.details-control', function () { console.log(table.row(this).data()); var tr = $(this).closest('tr'); var row = table.row(tr); if (row.child.isshown()) { // row open - close row.child.hide(); tr.removeclass('shown'); } else { // open row row.child(format(row.data())).show(); tr.addclass('shown'); } });
the format function:
function format(d) { // `d` original data object row return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">' + '<tr>'+ '<td><strong>blabla1</td>' + '<td align="center">'+ d.blabla1 + '</td>'+ '<td><strong>blabla2</td>' + '<td align="center">'+ d.blabla2+ '</td>'+ '</tr>' + '</table>'; }
however, when display page, , expand child rows, values of columns "undefined"...
the rows in datatable populated model (using mvc 4) follows:
<tbody> @foreach (var item in model) { <tr> <td align="center"> @html.displayfor(modelitem => item.blabla3) </td> .....</tr>} </tbody>
i think missing method row.data() loaded formatting function.... correct way of doing so? checked documentations , use tried....
apparently had select index of object/array returned .data() every row, following code worked me.....(replace known_index integer index of child row...)
<tr>'+ '<td><strong>blabla1</td>' + '<td align="center">'+ d[known_index]+ '</td>'+ . . . '</tr>'+
Comments
Post a Comment