EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: getk on May 24, 2013, 03:45:38 AM



Title: Datagrid Pagination issue
Post by: getk on May 24, 2013, 03:45:38 AM
Hi Friends,
I'm creating a datagrid and everything looks perfect with easyUI.

Some cosmetic issues still pending

1. Pagination issue
I've around 29rows in my sample data and have enabled row numbers. JSON data shows count correctly. (datagrid footer shows "Displaying 1 to 20 of 29 items" which is correct). My pagination limit is 20items per page.  But the datagrid has the vertical scrollbar to drag to view all 29 rows!
Also if I click on forward/next icon, it goes to second page but row number shows "21 to 41" ( I expected it to show  21 to 29)

I've tried using fit="true" , but still no luck.


Title: Re: Datagrid Pagination issue
Post by: stworthy on May 25, 2013, 01:59:45 AM
When enable remote paging, the server must return exact page rows(20 rows). If you are using client pagination, please refer to this example http://www.jeasyui.com/demo/main/index.php?plugin=DataGrid&theme=default&dir=ltr&pitem=Client%20Side%20Pagination.


Title: Re: Datagrid Pagination issue
Post by: getk on May 28, 2013, 03:17:02 AM
Thanks again mate.

Would it be really a good option to add it out-of-box in the next release ? to have client-side-pagination functionality automatically

Thanks again


Title: Re: Datagrid Pagination issue
Post by: dtucker on November 04, 2013, 03:55:41 PM
Did you get it to work? I have this but it isn't working

Code:
$('#dgMostVisitedPages').datagrid({
                  url: 'MostVisitedPages/MostVisitedPages.php?orgid='+ _selectedOrganization,
                  pagination:'true',
                  singleSelect:'true',
                  striped:'true'
                 
              });

Code:
<table id="dgServiceCategory" title="Service Categories" class="easyui-datagrid" toolbar="#toolbarServiceCategory" singleSelect="true">
<thead>
<tr>
<th data-options="field:'categoryid',width:80" hidden="true">ID</th>
<th data-options="field:'category',width:50" >Category</th>
</tr>
</thead>
</table>
<div id="toolbarServiceCategory">
<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="AddServiceCategory()">New Category</a>
<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="EditServiceCategory()">Edit Category</a>
<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="DeleteServiceCategory()">Remove Category</a>
</div>

Thanks
Dennis