jquery easyUI 的datagrid 表头排序

最新推荐文章于 2023-04-27 08:29:33 发布

原创最新推荐文章于 2023-04-27 08:29:33 发布 · 1.2w 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#easyui #datagrid #表头排序

jquery easyUI 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了jQuery EasyUI的datagrid组件如何实现表头排序，包括两种方式：页面刷新排序和服务器级排序。页面刷新时，需设置服务器数据项排序为false，并自定义sorter函数；服务器级排序则需要设置服务器数据项排序为true，接收并处理sort和order参数，调整后台分页查询SQL进行排序。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

datagrid的点击列表头刷新，分为两种，一种是页面刷新，不涉及后台服务器数据，不会从新查询数据库，只会刷新当前页数据；

一种是服务器级刷新，会重新加载全部数据

第一种，页面刷新

1、将服务器对数据项排序设置为false

2、设置field的排序属性为true，sorter的function内容自己写，如果该字段为数字或者字符串，可以用以下方法：

如果是时间类型，可使用以下方法：

第二种，服务器刷新，只能单列排序

1、将服务器对数据项排序设置为true，对要排序的列增加属性

2、后台分页查询方法，需要接收两个string类型的参数，sort以及order 参数名是固定的

如果有封装分页方法，则自己的查询sql不需要这两个参数，如果没有封装，则需要根据这两个参数排序

以下是封装的底层分页方法，sqlPage.append(" ORDER BY "+sort+" "+order);

public JQueryPage myOracleJQueryPage(String sort,String order,String sql,String rmOrderBy,Object[] params,Integer pageNumber,Integer pageSize){
		JQueryPage jQueryPage =new JQueryPage();
		
		String countSql="SELECT COUNT(1) FROM ( "+sql+" ) ";
		int totalCount  = getJdbcTemplate().queryForInt(countSql,params);
		
					jQueryPage.setTotal(totalCount);
		if (totalCount < 1) {
			jQueryPage.setRows(new ArrayList());
			return jQueryPage;
		}
		int begin=(pageNumber-1)*pageSize+1;
		int end = begin+pageSize;
		StringBuffer sqlPage=new StringBuffer(" SELECT * FROM (SELECT ROWNUM RN,TA.* FROM ( ");
			sqlPage.append(sql+rmOrderBy);
			sqlPage.append(" ) TA )WHERE RN >= "+ begin+" AND RN < "+ end );
			if(!StringUtils.isNullOrEmpty(sort)){
				sqlPage.append(" ORDER BY "+sort+" "+order);
			}
			
			jQueryPage.setRows(getJdbcTemplate().queryForList(sqlPage.toString(),params));
		
		return jQueryPage;
		
	}