datatable global search on keypress of enter key instead of any key keypress
We can use search feature by pressing "enter key" instead of key press search...
We need to add below code,
$('#myTable_filter input').unbind(); $('#myTable_filter input').bind('keyup', function (e) { if (e.keyCode == 13) { table.search(this.value).draw(); } });
Full code of bind datatable
var table = "";
var apisitename = 'http://localhost/DemoApp/api/';
$(document).ready(function () {
table = $("#myTable").DataTable({
"processing": true,
"serverSide": true,
"searching": true,
"ordering": true,
"paging": true,
"responsive": true,
"ajax": {
"url": apisitename + "CountriesList",
"type": "get",
"datatype": "json"
},
"columns": [
{ "data": "Name", "name": "Name"},
{
data: null,
orderable: false,
width: 100,
render: function (data, type, row) {
return "<a href='country/detail/?id=" + data.ID + "' class='btn btn-primary btn-small-x fa fa-search'></a>";
}
}
]
});
$('#myTable_filter input').unbind();
$('#myTable_filter input').bind('keyup', function (e) {
if (e.keyCode == 13) {
table.search(this.value).draw();
}
});
});
HTML
<table id="myTable" class="display responsive nowrap" cellspacing="0" width="100%">
<thead>
<tr>
<th>Country Name</th>
<th>Action</th>
</tr>
</thead>
</table>
Hope this will help you and save your time.
Enjoy !!!
:)
No comments:
Post a Comment