Hide "No data available in table" and\or Reinitialize Table
Hide "No data available in table" and\or Reinitialize Table
I have some challenges refreshing the data table with new data. By default my page loads with and empty grid and displays the "No data available in table". Then via a button I populate data to the table. This however still displays the "No data available in table" line at the top of the table. Please assist (code below):
// HTML Table
Domain | Name Server 1 | Name Server 2 | Contact | Expiry Date | Auto Renew | Locked | Functions |
---|
// The script part
jQuery(document).ready(function () {
// init table
Init_table_domains();
});
// This gets called from the button to populate the HTML table
function ListDomains() {
$('#table_domains').dataTable().fnClearTable();
$.ajax({
type: "POST",
url: "Functions.aspx/ListDomains",
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
success: function (response) {
$("#table_domains").append(response.d);
},
failure: function (response) { alert(response); }
});
}
function Init_table_domains() {
// Get default display length from cookie or just default
var pagedrop = $.cookie("pagesize");
if (pagedrop == "") { pagedrop = 5; }
if (typeof pagedrop === 'undefined') { pagedrop = 5; }
// begin: third table
$('#table_domains').dataTable({
"aLengthMenu": [
[5, 15, 20, -1],
[5, 15, 20, "All"] // change per page values here
],
// set the initial value,
"iDisplayLength": pagedrop,
"aaSorting": [[1, "asc"]],
"sPaginationType": "bootstrap",
"oLanguage": {
"sLengthMenu": "_MENU_ records",
"oPaginate": {
"sPrevious": "Prev",
"sNext": "Next"
}
},
"aoColumnDefs": [{
'bSortable': false,
'aTargets': [0]
}
]
});
jQuery('#table_domains .group-checkable').change(function () {
var set = jQuery(this).attr("data-set");
var checked = jQuery(this).is(":checked");
jQuery(set).each(function () {
if (checked) {
$(this).attr("checked", true);
} else {
$(this).attr("checked", false);
}
});
jQuery.uniform.update(set);
});
jQuery('#table_domains_wrapper .dataTables_filter input').addClass("form-control input-small"); // modify table search input
jQuery('#table_domains_wrapper .dataTables_length select').addClass("form-control input-xsmall"); // modify table per page dropdown
jQuery('#table_domains_wrapper .dataTables_length select').select2(); // initialize select2 dropdown
}