dataTable child rows detail info without ajax

index.html

<tr data-child-name="test1" data-child-value="10">
    <td>ParentRow</td>
    <td>No. 1</td>
</tr>
In the click handler (line 50 from the example):


<script>
  
// Add event listener for opening and closing details
$('#example tbody').on('click', 'td.details-control', function () {
  var tr = $(this).closest('tr');
  var row = table.row( tr );

  if (row.child.isShown()) {
       // This row is already open - close it
       row.child( format( tr.data('child-name'), tr.data('child-value') ) ).hide();
       tr.removeClass('shown');
   }
   else {
       // Open this row
       row.child( format( tr.data('child-name'), tr.data('child-value') ) ).show();
       tr.addClass('shown');
   }
});
  
</script>