reloading new dataset after dropdown selection
reloading new dataset after dropdown selection
jamies
Posts: 4Questions: 1Answers: 0
Hi there i am trying to reload the datatable after a user selected an item from a dropdown select. i keep getting that it cannot reinitialise the table error.
the url does work and shows the correct jsondata, it is more or less the same as the original table load.
here is the code in select change
$(document).ready(function(){
$("select.supportworkers").change(function(){
$('#tblusers').dataTable().fnClearTable();
var swid = $(this).children("option:selected").val();
var t = getCookie('token');
var i = getCookie('userid');
var sec =getCookie('sec');
var url = "<?php echo BASEURL ?>/users/getUsers.php?authtoken="+ t +"&uid="+i + "&sec=" + sec +"&swid=" +swid;
var table = $('#tblusers').DataTable({
"ajax": {
url : url
},
});
table.ajax.reload();
});
});
Belwo is the code i used to create and load the table on page load.
$(document).ready(function(){
var t = getCookie('token');
var i = getCookie('userid');
var sec =getCookie('sec');
var url = "<?php echo BASEURL ?>/users/getAllUsers.php?authtoken="+ t +"&uid="+i + "&sec=" + sec;
$('#tblusers').DataTable({
"processing": true,
"serverSide": true,
"ajax": {
url : url
},
"columns" : [
{ "data": "id",
"title": "User ID" },
{ "data": "username",
"title": "Username" },
{ "data": "firstname",
"title": "Firstname" },
{ "data": "lastname",
"title": "Lastname" },
{ "data": "dateofbirth",
"title": "Date of Birth" },
{"data": "Edit",
"title": "Edit",
render: function (data, type, full, meta) {
return '<button name="select" class="btn"><a href="edituser.php?id=' + full.id + '">Edit User</a></button>';
}
}
],
select: true,
select: 'single',
order: [[ 1, "asc" ]],
dom: 'Bfrtip',
language: {
emptyTable: "You haven't got any users assigned to you, or you dont have permissions.",
loadingRecords: "Getting records..."
},
responsive: {
details:
{
type: false,
renderer: $.fn.dataTable.Responsive.renderer.tableAll( {
tableClass: 'table table-striped table-bordered'
} )
}
}
}
)
.on( 'select', function ( e, dt, type, indexes ) {
console.log('Table row selected');
} );
});
This discussion has been closed.
Answers
Yep, this will re-initialise the table:
Just call
ajax.reload()instead, something like$('#tblusers').DataTable().ajax.reload(),Colin
Hi Colin,
i get the follwoing error
DataTables warning: table id=tblusers - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3
Colin highlighted the code which is causing the error, and showed what to replace it with. Did you follow that?
i am trying to reload the table with new/filtered data from the drop down so it needs to get the new data from the url.
If you just want to change the URL for the end-point, set it first with
ajax.url(), then callajax.reload(), so replace that code I mentioned above with:Colin