EasyUI Datagrid 前端按数字排序（自定义排序）

最新推荐文章于 2023-06-17 00:56:27 发布

原创

最新推荐文章于 2023-06-17 00:56:27 发布 · 1.7w 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#easyui #datagrid #sorter #自定义排序 #按数字排序

EasyUI Datagrid 默认使用字符串排序，但当数字以字符串形式展示时会导致排序错误。为解决此问题，可以使用Datagrid的sorter属性配合自定义函数`numberSort`进行数字排序。在列定义中添加`sorter="numberSort"`并确保`remoteSort="false"`，然后在前端将字符串转换为浮点数以实现准确的数字排序，同时保持数据的精确位数不变。

EasyUI Datagrid 前端排序默认采用字符串排序(String类型)。有时候，我们为了让Datagrid里显示的数字精确到一定位数，会将数据转换为字符串传到前台。

例如我们规定价格都精确到两位小数，那么22就转换为字符串“22.00”传到前台，这样虽然保证了精确位数的一致性，但是如果直接利用Datagrid默认的排序功能对这列字符串排序会出现一定问题：

这样，解决方法有两种，一种是将后台传到前台数据不转换，使用整型或者浮点型数据，例如22传到前台显示为22，而22.50传到前台会被显示为22.5，利用这样的数据排序是正确的，但是精确位数发生了变化，这是我们所不希望的。

另一种方法是利用Datagrid的自定义排序sorter进行排序。将字符串先转为浮点数，然后就可以通过自定义函数来实现按照数据大小排序。

sorter

function

T自定义字段排序函数，有2个参数：
a：该列的第一个值。
b：该列的第二个值。

示例:

$('#dg').datagrid({
	remoteSort: false,
	columns: [[
		{field:'date',title:'Date',width:80,sortable:true,align:'center',  
			sorter:function(a,b){  
				a = a.split('/');  
				b = b.split('/');  
				if (a[2] == b[2]){  
					if (a[0]

最低0.47元/天解锁文章