找回密码
 立即注册

QQ登录

只需一步,快速开始

Winny

超级版主

141

主题

261

帖子

1682

积分

超级版主

Rank: 8Rank: 8

积分
1682
Winny
超级版主   /  发表于:2022-4-24 17:23  /   查看:2409  /  回复:2
本帖最后由 Winny 于 2023-11-8 16:47 编辑

客户需求场景:
客户加载文件时,最初文件中是包含固定的表头的,这些表头不允许被编辑修改。除此之外,表中的部分数据,是从数据库查询过来的,也就是已经提交过的数据,这部分数据是不允许再编辑的。当用户点击锁定单元格时,需要给用户提示无法编辑。
关于表单保护的原理级特定场景的实现方式,可以参考文章:SpreadJS设置单元格编辑状态,这里我不再赘述。
要实现文章中用户想要的需求,需要以下几个步骤:
Step1:设计模板;
在模板中,需要设计用户的填写表格,表格的表头部分(demo中蓝色背景色的区域)不允许编辑,其余区域都可以编辑,可以参考文章末尾demo中的file.js。

Step2:加载已提交数据;
SpreadJS中支持多种设置数据的方式,这里我采取的是setArray()的方式来设置数据。setArray中的参数是一个二维数组,根据该二维数据,并结合模板结构,就可以再去设置加载数据区域单元格的锁定状态为true,使其也无法再被编辑。为了使用户视觉效果更加明显,这里我多设置了一个棕色的背景色。

Step3:  监听单元格click事件。
SpreadJS中,单元格的单击事件为GC.Spread.Sheets.Events.CellClick,可以从点击事件的回调中拿到当前单元格的行列信息,进而去判断单元格的锁定状态,当锁定状态为true时,我在这里弹出了一个alert框,实际项目中,大家可以酌情优化。

详细代码示例,可参考:https://jscodemine.grapecity.com/share/TI8aPt9k90mVTH1QhQieTQ/


https://jscodemine.grapecity.com/share/fX42--s1HU_4zEOPrGJRmQ

2 个回复

倒序浏览
y166
注册会员   /  发表于:2022-7-5 11:29:37
沙发
设置之后双击依然可以编辑是什么情况
回复 使用道具 举报
Winny
超级版主   /  发表于:2022-7-5 17:20:53
板凳
y166 发表于 2022-7-5 11:29
设置之后双击依然可以编辑是什么情况

请提供demo移步至求助专区发帖~
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 立即注册
返回顶部