EasyUI Forum
April 29, 2024, 08:50:40 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
EasyUI Forum > General Category > EasyUI for jQuery > Pagination not calculating correctly for html datagrid
Pages: [1]
« previous next »
  Print  
Author Topic: Pagination not calculating correctly for html datagrid  (Read 11411 times)
tslatt
Jr. Member
**
Posts: 85



View Profile
« on: October 10, 2011, 02:06:48 PM »
I applied a datagrid to my static html table with pagination set to true, but instead of paging the data, it shows all rows at once. How can I get the pagination to work without switching to importing a json table?

Any help would be greatly appreciated!

The JS:

Code:
$(function(){
	$('#assoc-listing').datagrid({
		title: 'My Listing',
		striped: true,
		rownumbers: true,
		pagination: true,
		pageNumber: 1,
		pageSize: 15,
		singleSelect: true,
		columns: [[
		 {field: 'alid', title: 'ID', width: 80, align: 'left', sortable: 'true', resizable: 'false'},
		 {field: 'alname', title: 'Name', width: 180, align: 'left', sortable: 'true', resizable: 'true'},
		 {field: 'alemail', title: 'Email', width: 200, align: 'left', sortable: 'true', resizable: 'true'},
		 {field: 'alcity', title: 'City', width: 120, align: 'left', sortable: 'true', resizable: 'false'},
		 {field: 'alstate', title: 'State', width: 30, align: 'left', sortable: 'true', resizable: 'false'},
		 {field: 'altitle', title: 'Title', width: 30, align: 'center', sortable: 'true', resizable: 'false'},
		 {field: 'alstatus', title: 'Status', width: 50, align: 'left', sortable: 'true', resizable: 'false'},
		 {field: 'alpromo', title: 'Promo Date', width: 85, align: 'left', sortable: 'true', resizable: 'false'},
		 {field: 'alapp', title: 'App Date', width: 85, align: 'left', sortable: 'true', resizable: 'false'}
		]]
	});
});

The HTML:

Code:
<table cellspacing="0" cellpadding="0" border="0" id="assoc-listing">
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@ymail.com</a></td>
    <td><a href="">Euless</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">08/30/2007</a></td>
    <td><a href="">02/18/2006</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">Copperas Cove</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">06/30/2009</a></td>
    <td><a href="">03/28/2007</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@yahoo.com</a></td>
    <td><a href="">Arlington</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">02/23/2010</a></td>
    <td><a href="">09/08/2006</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@yahoo.com</a></td>
    <td><a href="">Highland Village</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">06/30/2009</a></td>
    <td><a href="">10/06/2005</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@YAHOO.COM</a></td>
    <td><a href="">WICHITA FALLS</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">07/29/2007</a></td>
    <td><a href="">03/02/2006</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@verizon.net</a></td>
    <td><a href="">Southlake</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">06/14/2005</a></td>
    <td><a href="">01/21/2005</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">McKinney</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">05/12/2008</a></td>
    <td><a href="">06/12/2005</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">Fairfield</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">03/17/2008</a></td>
    <td><a href="">01/24/2005</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@hotmail.com</a></td>
    <td><a href="">Dublin</a></td>
    <td><a href="">GA</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">08/27/2008</a></td>
    <td><a href="">04/15/2008</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">Stafford</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">01/26/2008</a></td>
    <td><a href="">03/07/2005</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">Canton</a></td>
    <td><a href="">MI</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">06/30/2009</a></td>
    <td><a href="">08/04/2006</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@ymail.com</a></td>
    <td><a href="">Copperas Cove</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">07/23/2010</a></td>
    <td><a href="">01/16/2007</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href=""></a></td>
    <td><a href="">Macon</a></td>
    <td><a href="">GA</a></td>
    <td align="center">ED</td>
    <td align="center">T</td>
    <td><a href="">04/11/2008</a></td>
    <td><a href="">04/07/2008</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">Alpharetta</a></td>
    <td><a href="">GA</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">10/11/2010</a></td>
    <td><a href="">04/08/2008</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">Azle</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">02/08/2008</a></td>
    <td><a href="">01/24/2005</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@yahoo.com</a></td>
    <td><a href="">Mineral Wells</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">03/02/2011</a></td>
    <td><a href="">10/03/2006</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">Arlington</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">12/07/2006</a></td>
    <td><a href="">03/31/2005</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@yahoo.com</a></td>
    <td><a href="">Dallas</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">T</td>
    <td><a href="">01/31/2009</a></td>
    <td><a href="">09/01/2006</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">Woodstock</a></td>
    <td><a href="">GA</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">10/07/2010</a></td>
    <td><a href="">04/16/2008</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@gmail.com</a></td>
    <td><a href="">Baird</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">T</td>
    <td><a href="">05/11/2007</a></td>
    <td><a href="">01/13/2006</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@macklevel.com</a></td>
    <td><a href="">McDonough</a></td>
    <td><a href="">GA</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">12/25/2010</a></td>
    <td><a href="">08/13/2007</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href=""></a></td>
    <td><a href="">Marietta</a></td>
    <td><a href="">GA</a></td>
    <td align="center">ED</td>
    <td align="center">T</td>
    <td><a href="">04/22/2008</a></td>
    <td><a href="">08/04/2007</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@GMAIL.COM</a></td>
    <td><a href="">Philadelphia</a></td>
    <td><a href="">PA</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">04/01/2011</a></td>
    <td><a href="">07/29/2006</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@yahoo.com</a></td>
    <td><a href="">Corpus Christi</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">01/31/2008</a></td>
    <td><a href="">04/23/2005</a></td>
  </tr>
  <tr>
    <td>AXXXXXXX</td>
    <td><a href="">XXXX</a></td>
    <td><a href="">XXXX@yahoo.com</a></td>
    <td><a href="">Southlake</a></td>
    <td><a href="">TX</a></td>
    <td align="center">ED</td>
    <td align="center">Active</td>
    <td><a href="">01/29/2007</a></td>
    <td><a href="">01/21/2005</a></td>
  </tr>
</table>
Logged
tslatt
Jr. Member
**
Posts: 85



View Profile
« Reply #1 on: October 10, 2011, 02:17:55 PM »
Nevermind, I forgot that you have to set fit: true for the pagination to work!
Logged
dtucker
Newbie
*
Posts: 11


View Profile Email
« Reply #2 on: November 04, 2013, 03:50:42 PM »
I tried setting fit: true on my grid and it still doesn't work.

Code:
$('#dgMostVisitedPages').datagrid({
		                  url: 'MostVisitedPages/MostVisitedPages.php?orgid='+ _selectedOrganization,
		                  pagination:'true', 
		                  singleSelect:'true', 
		                  striped:'true', 
		                  fitColumns:'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
Logged
Pages: [1]
  Print  
« previous next »
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!