1#@!#!123s

: / home / vitalityhealth / www / s / js / examples /
Filename : examples.datatables.row.with.details.js
back
(function($){'use strict';var datatableInit=function(){var $table=$('#datatable-details');var fnFormatDetails=function(datatable,tr){var data=datatable.fnGetData(tr);return['<table class="table table-striped mb-0">','<tr class="b-top-0">','<td><label class="mb-0">Rendering engine:</label></td>','<td>'+data[1]+' '+data[4]+'</td>','</tr>','<tr>','<td><label class="mb-0">Link to source:</label></td>','<td>Could provide a link here</td>','</tr>','<tr>','<td><label class="mb-0">Extra info:</label></td>','<td>And any further details here (images etc)</td>','</tr>','</table>'].join('');};var th=document.createElement('th');var td=document.createElement('td');td.innerHTML='<i data-toggle class="far fa-plus-square text-primary h5 m-0" style="cursor: pointer;"></i>';td.className="text-center";$table.find('thead tr').each(function(){this.insertBefore(th,this.childNodes[0]);});$table.find('tbody tr').each(function(){this.insertBefore(td.cloneNode(true),this.childNodes[0]);});var datatable=$table.dataTable({dom:'<"row"<"col-lg-6"l><"col-lg-6"f>><"table-responsive"t>p',aoColumnDefs:[{bSortable:false,aTargets:[0]}],aaSorting:[[1,'asc']]});$table.on('click','i[data-toggle]',function(){var $this=$(this),tr=$(this).closest('tr').get(0);if(datatable.fnIsOpen(tr)){$this.removeClass('fa-minus-square').addClass('fa-plus-square');datatable.fnClose(tr);}else{$this.removeClass('fa-plus-square').addClass('fa-minus-square');datatable.fnOpen(tr,fnFormatDetails(datatable,tr),'details');}});};$(function(){datatableInit();});}).apply(this,[jQuery]);