The guide use Datatables js

Library:

<script type=”text/javascript” charset=”utf8″ src=”https://cdn.datatables.net/1.10.16/js/jquery.dataTables.js”></script>

HTML:

<table id=”example” class=”display” style=”width:100%”>
<thead>
<tr>
<th>Name</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger Nixon</td>
</tr>
<tr>
<td>Garrett Winters</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>Name</th>
</tr>
</tfoot>
</table>

Script in body:

<scritp>

$(‘#example tfoot th’).each( function () {
var title = $(this).text();
$(this).html( ‘<input type=”text” placeholder=”Search ‘+title+'” />’ );
} );

// DataTable
var table = $(‘#example’).DataTable();

// Apply the search
table.columns().every( function () {
var that = this;

$( ‘input’, this.footer() ).on( ‘keyup change’, function () {
if ( that.search() !== this.value ) {
that
.search( this.value )
.draw();
}
} );
} );

</scritp>

 

The guide use Datatables js

DONE!

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *