本帖最后由 Ellia.Duan 于 2024-4-19 16:46 编辑
很多用户在日常的开发中,经常会用到单元格保护的需求,本贴讲解如何使用在线表格编辑器及js代码来实现单元格保护。表单保护的机制: SpreadJS表单保护的机制与Excel完全一致,需要同时设置单元格锁定状态(locked)以及表单保护状态(isProtect)同时为true,才能让单元格禁止编辑。
1. 在线表格编辑器中实现表单保护
(1)保护整个工作簿
在线表格编辑器中没有直接将整个工作簿保护的操作按钮,需要依次设置每个sheet为保护状态,具体操作如下图所示
ps:在进行表单保护时,可以按需选择表单保护后还允许用户做哪些操作,截图如下。
(2)设置部分单元格可编辑
SpreadJS默认单元格的锁定状态为True,设置部分单元格可以编辑操作如下:
step1: 选中目标单元格,右键点击设置单元格格式;
step2:将目标单元格保护(锁定)状态设置为False;
step3: 右键当前sheetTab,选择保护工作表;
设置完成之后,就只有蓝色区域的单元格可以编辑,其它区域的单元格无法编辑。
(3)设置部分单元格不可编辑
step1: 选中整张工作表,右键点击设置单元格格式;
step2: 取消单元格保护(锁定)状态;
step3: 选中不允许编辑的单元格,右键设置单元格格式,将对应的锁定状态勾选;
step4: 右键当前sheet页底部tab,点击保护工作表。
设置完成后,就只有蓝色单元格无法编辑,其余单元格均可正常编辑。
2. js代码实现表单保护
(1) 设置整个工作簿不可编辑
- let sheetCount = spread.getSheetCount()
- for(let i=0; i<sheetCount; i++){
- spread.getSheet(i).options.isProtected = true
- }
复制代码
(2) 设置部分单元格可以编辑- //设置A1~B5可以编辑,其余单元格不可以编辑
- let range = sheet.getRange(0,0,5,2)
- range.locked(false)
- sheet.options.isProtected = true
复制代码
部分用户可能会有设置整行或整列可以编辑,其余不可编辑的需求,那如何获取整行或整列呢?
- //获取8~10行 -1在此代表所有列
- let range = sheet.getRange(7,-1,3,-1)
- //获取G~H列(-1在此代表所有行)
- let range = sheet.getRange(-1,6,-1,2)
复制代码
(3)设置部分单元格不能编辑
- let sheet = spread.getActiveSheet()
- let defaultStyle = sheet.getDefaultStyle()
- defaultStyle.locked = false
- sheet.setDefaultStyle(defaultStyle)
- let range = sheet.getRange(0,0,5,5)
- range.backColor('#9cf')
- range.locked(true)
- sheet.options.isProtected = true
复制代码 关于如何设置表单保护到此就结束了,但细心的小伙伴可能会留意到,在在线表格编辑器中设置表单保护后,还有勾选表单保护模式下允许用户做什么操作的选型,那用js如何实现这些选项呢?具体代码见下图:
- //表单保护下允许用户调整行高列宽
- let sheet = spread.getActiveSheet()
- sheet.options.protectionOptions.allowResizeRows = true
- sheet.options.protectionOptions.allowResizeColumns = true
复制代码 表单设置保护后具体还可以设置那些属性可以参考:https://demo.grapecity.com.cn/sp ... rksheet/protection#
|
|