报表sheet自定义下拉单元格

收藏

，报表sheet，这里有内置的几个单元格组件，如果这里要自定义一个下拉组件，怎么处理呢，和普通sheet是否一样的操作

Wilson.Zhang · Wilson.Zhang

您好！在报表模板中设置自定义单元格类型，TemplateSheet继承自Worksheet，可以通过TemplateSheet:setCellType()设置单元格类型。

可以参考官网API文档了解详情：
https://demo.grapecity.com.cn/sp ... rksheet#setcelltype

gnip · gnip

Wilson.Zhang 发表于 2024-9-4 17:49
您好！在报表模板中设置自定义单元格类型，TemplateSheet继承自Worksheet，可以通过TemplateSheet:setCellT ...

如图，我加了一个自定义的下拉，在填报的时候，选择的是下拉数据但是实际上我给后端服务一个是显示值，一个是真正的value，这块怎么处理呢，比如下拉数据接口获取的组织机构列表，数据结构为[{name:"xx机构',id:'312'},{name:"aa机构',id:'545'},{name:"bb机构',id:'43'}]，页面显示的是name，给后端的其实id，目前这里怎么映射呢

Wilson.Zhang · Wilson.Zhang

本帖最后由 Wilson.Zhang 于 2024-9-5 13:37 编辑

gnip 发表于 2024-9-4 18:11
如图，我加了一个自定义的下拉，在填报的时候，选择的是下拉数据但是实际上我给后端服务一个是显示值，一 ...

从您图示中的代码片段了解到您通过Style设置的下拉列表，通过Worksheet:getValue()便能获取到下拉选项实际的值，也可以通过ValueChanged事件监听单元格值变化，判断当前单元格是否有下拉列表，事件可以监听到被填充的值，即参数中的newValue，之后便可自行将数据传输至后端，如下动图所示：
下拉列表输入值获取.gif

可以参考附件demo了解详情：

gnip · gnip

Wilson.Zhang 发表于 2024-9-5 12:20
从您图示中的代码片段了解到您通过Style设置的下拉列表，通过Worksheet:getValue()便能获取到下拉选项实 ...

用你们17版本报表填报的时候，在预览那里，这里如果自定义的单元格，单元格内容需要显示中文，下拉也要显示中文，但是选择后，貌似是做不了映射的，单元格是啥，最后getChanges返回的就是啥，如果页面显示的是中文，最后数据能够在用户选择后类似{name:"item3",value:"3"}这样的结构返回呢？比如这里填报的时候是个组织机构，选中某个组织机构后，后端需要的肯定是组织机构的id，页面呈现的是组织中文名，如果选中后把中文给后端这是行不通的

Wilson.Zhang · Wilson.Zhang

gnip 发表于 2024-9-5 15:38
用你们17版本报表填报的时候，在预览那里，这里如果自定义的单元格，单元格内容需要显示中文，下拉也要显 ...

其实下拉列表的选项和值之间的映射关系在设置下拉列表时已经定义好了，对于您的需求场景，需要做的有两点：
1. 在单元格中显示的内容即在下拉列表中可见的选项内容。
2. 按照类似{name: "item3", value: "3"}的结构组织被选中的下拉列表选项，并将组织后的数据结构回传至后端。

针对第一点，在设置下拉列表时对每个选项设置了text和value属性，text属性值即下拉列表中可见的选项内容，而value才是实际的值，即您所说的“组织机构的id”。但是，从下拉列表中选择选项后，在单元格中显示的却是选项对应的value值。在您的需求场景中，text和value必须是不同的内容，text为中文字符串，value为数值。那么，可以监听CellClick事件，自行判断如果当前单元格中有下拉列表则轮询下拉列表的选项集合，判断当前值与其中哪个选项的value相同。如存在相同者，使用该选项的text回填至单元格，此时得到text和value值便可根据既定返回给后端的数据结构组织数据，第二点也得以解决。

可以参考附件demo，试看是否能满足您的需求。

gnip · gnip

Wilson.Zhang 发表于 2024-9-5 16:11
其实下拉列表的选项和值之间的映射关系在设置下拉列表时已经定义好了，对于您的需求场景，需要做的有两点 ...

下面是我借助17版本要做的填报，真实场景下我不会用到内置的下拉，因为ui要重构，参考社区的的方法我加了自定义单元格类型（https://gcdn.grapecity.com.cn/showtopic-100199-1-5.html），借助框架，内嵌了UI库的下拉组件，这里我该如何设置映射呢，因为这里是完全的自定义组件 image.png84715270.png

，目前是页面单元格是啥提交就是啥，没法做页面单元格的显示值映射

Ellia.Duan · Ellia.Duan

将在此贴中https://gcdn.grapecity.com.cn/fo ... read&tid=225972
继续回复。

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

[处理中] 报表sheet自定义下拉单元格

7 个回复

SpreadJS 认证

SpreadJS 高级认证