V17 部分单元格不可编辑，及只读功能。以及只读单元格添加样式。

收藏

问题一：如何设置某一个单元格只读？

当设置为 sheet.options.isProtected = true; 时，整个表单都变得不可编辑。可需求是只要某个单元格只读。

单纯的设置

sheet.getCell(this.sheet.getActiveColumnIndex(), this.sheet.getActiveRowIndex()).locked(true)

并不能让需要的单元格变得只读。

问题二：如何给当前单元格添加一个只读的样式，比如背景色置灰。取消只读功能时，该单元格样式恢复成设置只读样式之前的样式。

Ellia.Duan · Ellia.Duan

您好，问题一，可以参考下面的文章解决：
https://demo.grapecity.com.cn/sp ... C%E7%BC%96%E8%BE%91

监听事件，如果是您不想编辑的单元格，则args.cancel = true;

问题二：如果是在表单保护状态下，可以根据单元格状态设置只读的样式。此时并不需要判断哪个单元格只读，也不需要保存单元格变为只读样式之前的背景色。
https://demo.grapecity.com.cn/sp ... introduction/purejs
image.png839662780.png

如果您用上面提供的方案的话，需要将单元格的背景色提前保存下来，当只读时，设置只读样式，当可以编辑时，获取提前保存的样式，进行重置。

卑微的打工狗 · 卑微的打工狗

Ellia.Duan 发表于 2024-6-6 16:55
您好，问题一，可以参考下面的文章解决：
https://demo.grapecity.com.cn/spreadjs/help/docs/faqs/EventR ...

this.sheet.bind(GC.Spread.Sheets.Events.EditStarting, (sender, args) => {
// 判断如果是不能编辑的单元格，则执行以下代码
if (!this.sheet.getCell(args.col, args.row).locked()) {
args.cancel = true;
}
});

复制代码

通过这段代码，可以实现禁用某个单元格的效果，但该代发，是否无法与（以下代码）rendonly代码兼容

// var style = new GC.Spread.Sheets.Style();
// style.backColor = 'blue';
// var range = new GC.Spread.Sheets.Range(0, 0, 1, 1);
// this.sheet.cellStates.add(range, GC.Spread.Sheets.CellStatesType.readonly, style);

复制代码

也就是说，通过监听单元格，判断 cancel 为true 的方式可以达到禁用单元格的效果，但貌似该方式下，readonly 不生效。

Ellia.Duan · Ellia.Duan

不好意思，关于第二个问题，我给您提供了两种方案，
第一种是表单保护的方案：即设置locked后，设置sheet.options.isProtected = true; 此种方案可以设置单元格状态（readonly）
第二种方案是针对您的第一个问题，使用事件监听设置单元格是否编辑，此时由于没有设置表单保护，所以单元格状态的方案不可用。

image.png374512633.png

卑微的打工狗 · 卑微的打工狗

本帖最后由卑微的打工狗于 2024-6-6 18:07 编辑

Ellia.Duan 发表于 2024-6-6 17:42
不好意思，关于第二个问题，我给您提供了两种方案，
第一种是表单保护的方案：即设置locked后，设置sheet. ...

了解了您的意思，但我发现一个奇奇怪怪的问题；

首先我在刚进入的 designerInitialized 回调方法中使用 sheet.options.isProtected = true; 保护表单，然后根据需求，把所有的单元格进行 locked 进行false处理。

<span style="color: rgb(81, 81, 81); background-color: rgb(255, 255, 255);">sheet.options.isProtected = true; </span>

复制代码

然后再添加右键的方法中，使用如下所示代码，进行部分 locked 为 true

let designerConfig = GC.Spread.Sheets.Designer.DefaultConfig;
designerConfig.commandMap["disableCell"] = {
text: "设置为只读",
commandName: "disableCell",
execute: () => {
var selections = this.sheet.getSelections()[0];
if (this.sheet.getCell(selections.row, selections.col).locked() == true) {
console.log('取消操作')
this.sheet.getRange(selections.row, selections.col, selections.rowCount, selections.colCount).locked(false);
} else {
console.log('添加操作')
this.sheet.getRange(selections.row, selections.col, selections.rowCount, selections.colCount).locked(true);
var style = new GC.Spread.Sheets.Style();
style.backColor = 'blue';
this.sheet.cellStates.add(selections, GC.Spread.Sheets.CellStatesType.readonly, style);
}
}
};
designerConfig.contextMenu.push("disableCell");

复制代码

但是以上方法，再多次毫无规律的点击下，设置的背景蓝色，莫名其妙的消失，而后又毫无规律的出现。

请问，该问题如何解决

Ellia.Duan · Ellia.Duan

您好，设置只读单元格样式的相关代码，不需要每次都设置，

image.png435934447.png

如下动图所示，为整个sheet设置只读单元格状态，
image.png563793334.png

在设置只读单元格状态后，再次设置锁定单元格，此时发现只设置locked属性，但是样式生效，如下图所示
image.png69518431.png

此外，再重设locked时，需要关闭表单保护，再设置locked之后，再开启表单保护。

sheet.options.isProtected = false;
sheet.getCell(5,5).locked(true)
sheet.options.isProtected = true;

复制代码

卑微的打工狗 · 卑微的打工狗

本帖最后由卑微的打工狗于 2024-6-7 11:18 编辑

Ellia.Duan 发表于 2024-6-7 10:40
您好，设置只读单元格样式的相关代码，不需要每次都设置，

根据您提供的办法做了演示，但是设置的蓝色只读状态，还是会莫名其妙的消失，又突然出现。

根本问题没有解决。V17.0.10版本。

另外，再不设置表单保护，使用以下方法，锁定单元格时，有没有对应的单元格只读样式的设置。类似于 readonly 一样

// this.sheet.bind(GC.Spread.Sheets.Events.EditStarting, (sender, args) => {
// // 判断如果是不能编辑的单元格，则执行以下代码
// if (!this.sheet.getCell(args.col, args.row).locked()) {
// args.cancel = true;
// }
// });

复制代码

Ellia.Duan · Ellia.Duan

关于蓝色背景消失的问题，您可以提供一个复现问题的demo ，上传上来，具体调研下。
关于第二个问题，思路就是为锁定单元格设置样式。
image.png181032408.png

卑微的打工狗 · 卑微的打工狗

Ellia.Duan 发表于 2024-6-7 12:02
关于蓝色背景消失的问题，您可以提供一个复现问题的demo ，上传上来，具体调研下。
关于第二个问题，思路 ...

ssjson文件不是给你们了吗

卑微的打工狗 · 卑微的打工狗

Ellia.Duan 发表于 2024-6-7 12:02
关于蓝色背景消失的问题，您可以提供一个复现问题的demo ，上传上来，具体调研下。
关于第二个问题，思路 ...

您好，我觉得我需要与你们进行一次电话沟通。。。

我试着用cdn引用的方式，针对readonly状态下，背景色莫名其妙消失的问题做了测试。再版本17.0.10下，是正常的。

然后我起两个vue工程，一个是15版本，一个是17版本，其中，设计器里面的代码，我是拷贝过去的，除了LicenseKey 以外，别的代码都一模一样。

项目效果显示17版本下，出现了莫名奇妙消失又出现的问题，但再15版本下，没有该问题。

视频为两个服务，第一个是17版本有问题的演示，第二个是15版本，没有问题的演示。

		自动登录	找回密码
密码			立即注册

[处理中] V17 部分单元格不可编辑，及只读功能。以及只读单元格添加样式。

13 个回复

17.0.10

SpreadJS 认证

SpreadJS 高级认证