datatables: use new way of generating labels for count of dynamic datatables.

- according to docs this is a better way. We'll use this in other places with some added changes.
This commit is contained in:
Marcin Kuzminski 2018-04-25 15:28:01 +02:00
parent a9aca0d074
commit ffb6dbc6f3
2 changed files with 22 additions and 40 deletions

View file

@ -22,21 +22,21 @@
$(document).ready(function() {
var $sshKeyListTable = $('#ssh_keys_table');
var getDatatableCount = function(){
var table = $sshKeyListTable.dataTable();
var page = table.api().page.info();
var active = page.recordsDisplay;
var total = page.recordsTotal;
var _text = _gettext("{0} out of {1} ssh keys").format(active, total);
$('#ssh_keys_count').text(_text);
};
// user list
$sshKeyListTable.DataTable({
processing: true,
serverSide: true,
ajax: "${h.route_path('admin_permissions_ssh_keys_data')}",
ajax: {
"url": "${h.route_path('admin_permissions_ssh_keys_data')}",
"dataSrc": function ( json ) {
var filteredCount = json.recordsFiltered;
var total = json.recordsTotal;
var _text = _gettext("{0} out of {1} ssh keys").format(filteredCount, total);
$('#ssh_keys_count').text(_text);
return json.data;
}
},
dom: 'rtp',
pageLength: ${c.visual.admin_grid_items},
order: [[ 0, "asc" ]],
@ -75,11 +75,6 @@ $(document).ready(function() {
$sshKeyListTable.css('opacity', 0.3);
});
// refresh counters on draw
$sshKeyListTable.on('draw.dt', function(){
getDatatableCount();
});
// filter
$('#q_filter').on('keyup',
$.debounce(250, function() {

View file

@ -43,23 +43,15 @@
<script type="text/javascript">
$(document).ready(function() {
var $userListTable = $('#fork_list_table');
var $forksListTable = $('#fork_list_table');
var getDatatableCount = function(){
var table = $userListTable.dataTable();
var page = table.api().page.info();
var active = page.recordsDisplay;
var total = page.recordsTotal;
var _text = _gettext("{0} out of {1} users").format(active, total);
$('#user_count').text(_text);
};
// user list
$userListTable.DataTable({
// fork list
$forksListTable.DataTable({
processing: true,
serverSide: true,
ajax: "${h.route_path('repo_forks_data', repo_name=c.repo_name)}",
ajax: {
"url": "${h.route_path('repo_forks_data', repo_name=c.repo_name)}",
},
dom: 'rtp',
pageLength: ${c.visual.dashboard_items},
order: [[ 0, "asc" ]],
@ -92,23 +84,18 @@ $(document).ready(function() {
}
});
$userListTable.on('xhr.dt', function(e, settings, json, xhr){
$userListTable.css('opacity', 1);
$forksListTable.on('xhr.dt', function(e, settings, json, xhr){
$forksListTable.css('opacity', 1);
});
$userListTable.on('preXhr.dt', function(e, settings, data){
$userListTable.css('opacity', 0.3);
});
// refresh counters on draw
$userListTable.on('draw.dt', function(){
getDatatableCount();
$forksListTable.on('preXhr.dt', function(e, settings, data){
$forksListTable.css('opacity', 0.3);
});
// filter
$('#q_filter').on('keyup',
$.debounce(250, function() {
$userListTable.DataTable().search(
$forksListTable.DataTable().search(
$('#q_filter').val()
).draw();
})