dataTable not showing Loading after ajax.reload
dataTable not showing Loading after ajax.reload
shahbour
Posts: 1Questions: 1Answers: 0
Hello
i am trying a simple example that do fetch data from json , and it is working great .
My only issue is that when i do reload , it is not showing the loading and direclty showing the result.
I read that it was an issue in 1.10.0 and i did update to 1.10.3 but still same issue.
<html>
<head>
<link rel="stylesheet" href="/assets/css/jquery.dataTables.min.css" />
</head>
<body>
<input id="fromDate" value="20141008 00:00:00" />
<button id="btnSearch">Search</button>
<br />
<table id="cdrGroup"
class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th>id</th>
<th>Date</th>
<th>Hour</th>
<th>Customer</th>
<th>Vendor</th>
<th class="align-left">Attempts </th>
<th class="align-left">Connected </th>
<th align="right">Duration </th>
<th align="right">ASR </th>
<th align="right">ACD </th>
<th align="right">NER </th>
<th align="right">BUY </th>
<th align="right">SELL </th>
<th align="right">GP </th>
</tr>
</thead>
<tfoot>
<tr>
<th>id</th>
<th>Date</th>
<th>Hour</th>
<th>Customer</th>
<th>Vendor</th>
<th class="align-left">Attempts </th>
<th class="align-left">Connected </th>
<th align="right">Duration </th>
<th align="right">ASR </th>
<th align="right">ACD </th>
<th align="right">NER </th>
<th align="right">BUY </th>
<th align="right">SELL </th>
<th align="right">GP </th>
</tr>
</tfoot>
<tbody>
</tbody>
</table>
<script type="text/javascript">
jQuery(function($) {
var oTable1 = $('#cdrGroup')
.DataTable({
"ajax" : {
"url" : "/group/daily",
"type" : "GET",
"dataSrc" : "",
"data": function ( d ) {
d.fromDate = $("#fromDate").val();
d.toDate = '20141010 23:59:59'
d.customerId = -1;
d.vendorId = -1;
}
},
"columns" : [ { "data" : "id" },
{ "data" : "startDate",
"type": "date"
},
{ "data" : "dayHour" },
{ "data" : "customer" },
{ "data" : "vendor" },
{ "type" : "num-fmt" , "data" : "attempts" },
{ "data" : "connected",
"type" : "num-fmt"
},
{ "data" : "duration" },
{ "data" : "asr",
"render" : function ( data, type, full, meta ) {
return numeral(data).format('0.00%');
}
},
{ "data" : "acd",
"render" : function ( data, type, full, meta ) {
return numeral(data).format('0,0.00');
}
},
{ "data" : "ner" },
{ "data" : "buy",
"render" : function ( data, type, full, meta ) {
return numeral(data).format('$0,0.00');
}
},
{ "data" : "sell",
"render" : function ( data, type, full, meta ) {
return numeral(data).format('$0,0.00');
}
},
{
"data" : "gp",
"render" : function ( data, type, full, meta ) {
return numeral(data).format('$0,0.00');
}
}
],
"columnDefs": [
{
"render": function ( data, type, row ) {
return numeral(data).format('0,0');
},
"targets": [ 5 , 6 ]
},
{ "render": function ( data, type, row ) {
return numeral(data).format('0,0.00');
},
"targets": [ 7 ]
},
{ "visible": false, "targets": [0 , 2 , 3 , 4 ] },
{ className: "align-right", "targets": [ 5,6,7,8,9,10,11,12,13 ] }
],
bAutoWidth : false,
});
$("#btnSearch").click(function () {
oTable1.ajax.reload(function ( json ) {
// $('#myInput').val( json.lastInput );
} );
});
})
</script>
</body>
</html>
BR
Shahbour