请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册

QQ登录

只需一步,快速开始

Derrick.Jiao 讲师达人认证 悬赏达人认证 SpreadJS 开发认证
论坛元老   /  发表于:2022-8-24 15:30  /   查看:1132  /  回复:0
相信有看过下面这篇文章的朋友应该对应自定义筛选框的自定义不陌生了。
https://gcdn.grapecity.com.cn/showtopic-57729-1-21.html

那有的朋友除了想要自定义筛选,那么还有的朋友想要自定义排序,那么今天这个教程来了。背景是这样的,因为有的朋友用数据绑定,在数据源中会有id这样一些不需要展示的字段,但是排序过后,id和数据源就对不上了。就像下面的例子那样,因为我们的排序简单理解就是交换单元格。
image.png157829283.png

想要解决这个问题,可以通过自定义的排序框实现。那自定义的排序逻辑就是把数据源拿出来,自己排一遍,排完在setDataSource回去。

与筛选弹窗类似,第1步,自定义弹框方法:customFilterDialog
image.png604610290.png

2、初始化弹窗,也就是把弹窗用html+css“画出来”
image.png795280761.png

3、实现open方法,通过样式控制筛选弹框的显示
image.png551557311.png

4、选定升序或者降序后,关闭弹窗
image.png261216124.png

另外,需要注意的是,如果想要点击之后筛选按钮能够正常显示下图的排序效果
image.png710776672.png

需要维护一下的排序信息
image.png829692687.png

下载附件即可查看完整demo。
自定义升降序_update.html (18.55 KB, 下载次数: 17)

0 个回复

您需要登录后才可以回帖 登录 | 立即注册
返回顶部