jQuery UI Widgets › Forums › Grid › Grid not recognizing totalrecords
Tagged: adapter, grid, totalrecords
This topic contains 3 replies, has 1 voice, and was last updated by SoftwareIsHappiness 8 years, 2 months ago.
-
Author
-
Hi,
The beforeprocessing sets source.totalrecords and this can be confirmed when I dump source to the JavaScript console however the grid component doesn’t recognize totalrecords (and data cannot be paginated).
I have followed the documentation. Code below. Screen shot is available at: https://drive.google.com/file/d/0B3pVkDbt5U54dnFHcURUS2R6ZGc/view?usp=sharing
HTML/JavaScript
<script type="text/javascript"> $(document).ready(function () { var url = "/admin/user/find"; var source = { datatype: "json", datafields: [ { name: 'id', type: 'int' }, { name: 'name', type: 'string' }, { name: 'email', type: 'string' }, { name: 'created_at', type: 'date' }, { name: 'updated_at', type: 'date' } ], id: 'id', root: 'data', beforeprocessing: function (data) { source.totalrecords = data.totalrecords; console.dir(source); }, url: url, pager: function (pagenum, pagesize, oldpagenum) { // callback called when a page or page size is changed. } }; var dataAdapter = new $.jqx.dataAdapter(source); $("#jqxgrid").jqxGrid({ theme: theme, width: '100%', source: dataAdapter, selectionmode: 'multiplerowsextended', sortable: true, pageable: true, autoheight: true, columnsresize: true, columns: [ { text: 'Id', datafield: 'id', width: '10%' }, { text: 'Name', datafield: 'name', width: '20%' }, { text: 'Email', datafield: 'email', width: '30%' }, { text: 'Created', datafield: 'created_at', width: '20%', cellsformat: 'd' }, { text: 'Update', datafield: 'updated_at', width: '20%', cellsformat: 'd' } ] }); }); </script> <div id='jqxWidget' style="width: 100%;"> <div id="jqxgrid"> </div> </div>
JSON
{ "data":[ { "id":1, "name":"Administrator", "email":"Admin@SoftwareIsHappiness.com", "created_at":null, "updated_at":null }, { "id":2, "name":"User1", "email":"User1@SoftwareIsHappiness.com", "created_at":null, "updated_at":null }, { "id":3, "name":"User2", "email":"User2@SoftwareIsHappiness.com", "created_at":null, "updated_at":null }, { "id":4, "name":"User3", "email":"User3@SoftwareIsHappiness.com", "created_at":null, "updated_at":null }, { "id":5, "name":"User4", "email":"User4@SoftwareIsHappiness.com", "created_at":null, "updated_at":null }, { "id":6, "name":"User5", "email":"User5@SoftwareIsHappiness.com", "created_at":null, "updated_at":null }, { "id":7, "name":"User6", "email":"User6@SoftwareIsHappiness.com", "created_at":null, "updated_at":null }, { "id":8, "name":"User7", "email":"User7@SoftwareIsHappiness.com", "created_at":null, "updated_at":null }, { "id":9, "name":"User8", "email":"User8@SoftwareIsHappiness.com", "created_at":null, "updated_at":null }, { "id":10, "name":"User9", "email":"User9@SoftwareIsHappiness.com", "created_at":null, "updated_at":null } ], "totalrecords":100 }
Thanks,
MichaelNOTE: Using jQWidgets v4.3.0 (2016-Oct)
Hi,
I followed the documentation for “Server-Side Paging with jQuery Grid” at: http://www.jqwidgets.com/server-side-paging-with-jquery-grid/
Why isn’t the grid/adapter recognizing source.totalrecords?
We intend to purchase jQuery Widgets but are attempting to implement CRUD/Grid functionality first. Assistance is so greatly appreciated!
Thanks,
MichaelHi,
This post is resolved. I had omitted virtualmode: true and rendergridrows callback— both are necessary in addition to pageable: true.
$("#jqxgrid").jqxGrid({ theme: theme, width: '100%', source: dataAdapter, selectionmode: 'multiplerowsextended', sortable: true, pageable: true, virtualmode: true, rendergridrows: function() { return dataAdapter.records; }, autoheight: true, columnsresize: true, columns: [ { text: 'Id', datafield: 'id', width: '10%' }, { text: 'Name', datafield: 'name', width: '20%' }, { text: 'Email', datafield: 'email', width: '30%' }, { text: 'Created', datafield: 'created_at', width: '20%', cellsformat: 'd' }, { text: 'Update', datafield: 'updated_at', width: '20%', cellsformat: 'd' } ] });
Thanks,
Michael -
AuthorPosts
You must be logged in to reply to this topic.