alfajango / jquery-dynatable

A more-fun, semantic, alternative to datatables
http://www.dynatable.com
Other
2.77k stars 362 forks source link

Pagination not working right with ajax #207

Open pandorawombat opened 9 years ago

pandorawombat commented 9 years ago

https://github.com/alfajango/jquery-dynatable/issues/113 was a thread where this issue was raised, and it looks like no one on the team ever even read the thread. I am having the exact same problem - loading my item via ajax: true produces incorrect pagination.

Pagination looks like this: badpagination

with forward and back arrows disabled, instead of paginating and saying 1 to 5 of 2938 which is what I would expect.

example JSON is as follows (the JSON will return subsets of 5 or 20 records based on the query sent by the pagination, this is the "opening" query of exactly 5) {"records":[{"id":"10335","name":"Jacqueline Raque","email":"raquej11@gmail.com","phone":"","address":"","color":"d9534f","image":"\/app\/assets\/images\/user_placeholder.png"},{"id":"10336","name":"Dan Cassin","email":"","phone":"502 554-2397","address":"","color":"d9534f","image":"\/app\/assets\/images\/user_placeholder.png"},{"id":"10337","name":"Recipe Recipe","email":"","phone":"","address":"","color":"d9534f","image":"\/app\/assets\/images\/user_placeholder.png"},{"id":"10338","name":"David Fonseca","email":"dfonseca@semonin.com","phone":"","address":"","color":"d9534f","image":"\/app\/assets\/images\/user_placeholder.png"},{"id":"10339","name":"Ruth Flath","email":"rflath@semonin.com","phone":"","address":"","color":"d9534f","image":"\/app\/assets\/images\/user_placeholder.png"}], "queryRecordCount":"5", "totalRecordCount":2938}

Here's the init code, which will look complex because we are using a writer to create a special format, but I tried the exact same ajax JSON data in a plain old table with no special writer, and it still had the pagination wrong:

$('ul#contact-list.list-group').dynatable({ dataset: { ajax: true, ajaxUrl: '/ajax/contact_json/', ajaxOnLoad: true, perPageDefault: 5, perPageOptions: [5,20], records: [] }, table: { bodyRowSelector: '.a-contact' }, features: { paginate: true, sort: true, search: true, pushState: false, recordCount: true, perPageSelect: true }, inputs: { queryEvent: 'keyup', queries: jQuery('#contact-search'), processingText: '{{ $loaderHtml }}', paginationClass: 'pagination pagination-sm', paginationActiveClass: 'active', paginationDisabledClass: 'disabled', perPageTarget: '#contact-perpage', perPagePlacement: 'append', recordCountTarget: '#contact-pagination', recordCountPlacement: 'append', paginationLinkTarget: '#contact-pagination', paginationLinkPlacement: 'prepend', paginationPrev: '«', paginationNext: '»', }, readers: { _rowReader: ulReader }, writers: { _rowWriter: ulWriter }, params: {

            }
        });

Do I need to add some params to this init? Is there something missing from my JSON data? I have been beating my head against this for quite a while and have tried things I read in several threads, to no avail.

epinapala commented 8 years ago

Here is a change that I did to fix this,

Under the function : PaginationLinks

Look for this line

pages = Math.ceil(settings.dataset.queryRecordCount / settings.dataset.perPage),

replace it with the below

pages = Math.ceil(settings.dataset.totalRecordCount / settings.dataset.perPage),

Ideally, The number of pages should be calculated by total records count, also the queryRecordCount seems to be null.

canuk commented 7 years ago

@epinapala That seems to be the fix, thanks! Were you able to send a pull request to @alphajango? It looks like this plugin, as great as it is, doesn't seem to be in active development.

mumaralhafidz commented 6 years ago

Thanks for answers @epinapala

morgan-blondellet commented 4 years ago

@epinapala Thank you my good sir !