JSFiddle - React, Tailwind, and code Playground
HTML
<?php
//error_reporting(E_ALL);
//ini_set('display_errors', 1);
include './head.php';
?>
<!--<button id="pdf" ><img width="30" src="img/pdf.png" class="img-responsive"></button>-->
<br> <a href="?lang=en" class="col-lg-offset-5 btn btn-primary btn-lg">En</a>
<a href="?lang=bg" class="btn btn-success btn-lg">Bg</a>
<div style="margin-top:50px;" class="container">
<table cellpadding="0" class="table-responsive table table-bordered table-hover display" id="example">
<thead>
<tr>
<?php if ($_GET['lang'] === 'en') { ?>
<th>ID</th>
<th>First Name</th>
<th>Sur Name</th>
<th>Last Name</th>
<?php } else { ?>
<th>№</th>
<th>Име</th>
<th>Презиме</th>
<th>Фамилия</th>
<th>Действия</th>
<?php } ?>
</tr>
</thead>
<tfoot>
<tr>
<?php if ($_GET['lang'] === 'en') { ?>
<th>ID</th>
<th>First Name</th>
<th>Sur Name</th>
<th>Last Name</th>
<?php } else { ?>
<th>№</th>
<th>Име</th>
<th>Презиме</th>
<th>Фамилия</th>
<!--<th>Действия</th>-->
<?php } ?>
</tr>
</tfoot>
</table>
</div>
</body>
</html>
CSS
body.loading {
overflow: hidden;
}
body.loading .modal {
display: block;
}
.dataTables_filter {
display: none;
}
thead, tfoot {
display: table-header-group;
}
.modal {
display: none;
position: fixed;
z-index: 1000;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgba( 255, 255, 255, .8 )
url('http://i.stack.imgur.com/FhHRx.gif')
50% 50%
no-repeat;
}
/*#example tr,td,th{
text-align: center;
}*/
.img{
width: 30px;
}
tfoot {
border-bottom: 1.2px solid black !important;
};
JavaScript
$(document).ready(function () {
get = getGetPar('lang');
if (get !== 'en') {
$('#example').DataTable({
"dom": 'T<"clear">lfrtip',
"tableTools": {
"aButtons": [
{
"sExtends": "print",
"sButtonText": "<img id='print' class='img' src='img/print.png'>",
//"sMessage": '<br><button class="pr btn btn-lg center-block">Print</button>'
},
// {
// "sExtends": "pdf",
// "sButtonText": "<img class='img' src='img/pdf.png'>"
// },
{
"sExtends": "xls",
"sButtonText": "<img class='img' src='img/excel.png'>",
"oSelectorOpts": {
page: 'current'
}
}
],
"sSwfPath": "swf/copy_csv_xls_pdf.swf"
},
"processing": true,
"serverSide": true,
"stateSave": true,
"ajax": {
"url": "post.php",
"type": "POST"
},
"columns": [
{"data": "kids_id"},
{"data": "kids_firstname"},
{"data": "kids_surname"},
{"data": "kids_lastname"}
],
"oLanguage": {
"sProcessing": "Обработка на резултатите...",
"sLengthMenu": "Показване на _MENU_ резултата",
"sZeroRecords": "Няма намерени резултати",
"sInfo": "Показване на резултати от _START_ до _END_ от общо _TOTAL_",
"sInfoEmpty": "Показване на резултати от 0 до 0 от общо 0",
"sInfoFiltered": "(филтрирани от общо _MAX_ резултата)",
"sInfoPostFix": "",
"sSearch": "Търсене във всички колони:",
...