telegram_bots/static/js/examples/examples.datatables.row.with.details.js

83 lines
2.1 KiB
JavaScript
Raw Normal View History

2019-01-11 19:16:01 +00:00
/*
Name: Tables / Advanced - Examples
Written by: Okler Themes - (http://www.okler.net)
Theme Version: 2.1.1
*/
(function($) {
'use strict';
var datatableInit = function() {
var $table = $('#datatable-details');
// format function for row details
var fnFormatDetails = function( datatable, tr ) {
var data = datatable.fnGetData( tr );
return [
'<table class="table 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('');
};
// insert the expand/collapse column
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] );
});
// initialize
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']
]
});
// add a listener
$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]);