活字格中嵌入spreadJS的问题

项目需求：

由与产品需求，该项目涉及大量非关系型数据的增删改查，跨表间公式引用，多层级区域分组，并需要用户可以自行实现对表格间关系的编辑：如对计算公式的修改操作、创建行及列、不定序插入修改删除记录等。

当前活字格版本内置的表格控件对关系型数据库适应度较好，但相对不适用于非关系型数据库对表格的铺设，由于SpreadJ表格控件产品支持json传值，而且功能与 Excel 高度类似，故此我们决定通过在活字格基础上嵌入SpreadJS控件实现来产品功能，它与我们想要实现的灵活表格编辑功能更加吻合。

我们想要实现的功能：

（如图）通过活字格按钮类型单元格(导入按钮)点击时执行JS命令实现EXCEL文件上传，并将该文件内数据传递到下方“嵌入HTML自定义页面(源自:https://gcdn.grapecity.com.cn/showtopic-50577-1-1.html)”类型插件中被嵌入的spreadJS页面中，实现数据展示

已执行条件：

在设立了左侧和上侧导航栏作为母版页后，又引入了标签页插件（https://gcdn.grapecity.com.cn/fo ... 54661&fromuid=52377）作为单独的页面容器（单独页面不直接关联母版页，通过左侧菜单栏中编辑“打开页面标签”点击命令将对应的页面借由标签页容器显示在占位区中）：

在单独的页面中：已通过资源文件夹路径下的test.html在页面中引入jquery-3.4.1.js，gc.spread.sheets.all.13.0.0.min.js，gc.spread.excelio.13.0.0.min.js，gc.spread.sheets.excel2013darkGray.13.0.0.css三个SpreadJS支持文件，以及test.js（初始化js文件）（以上文件已上传在页尾附件中）

并已成功执行出按钮功能栏下方的自定义HTML页面。

在通过活字格按钮类型单元格(导入按钮)点击时执行以下JS命令时：

spread.fromJSON(jsonData);

var excelIo = new GC.Spread.Excel.IO();

//import excel file to Spread.Sheets json

excelIo.open(excelFile, function (json) {

       varworkbookObj = json;

              spread.fromJSON(workbookObj);

}, function (e) {

       //process error

              console.log(e);

});），

遇到问题：

spread在之前引入的test.js中已经用var spread = newGC.Spread.Sheets.Workbook(document.getElementById('ss')); 声明过该变量，但调用时报错。

（上图为点击导入按钮时加载的命令）

求助大神帮忙看下这个问题如何解决

动态多行列头应该是满足的哈，只是这个需要去看 SpreadJS 相关 API 了。
另外就是活字格这边的 SpreadJS 是定制版的，并不是 SpreadJS 的所有能力都能在活字格使用。如果大佬有这方面的需求的话，可以去 SpreadJS 板块去了解一波。

另外就是下面有个相关的解决方案，大佬也可以参考一下，希望能有帮助。
【新提醒】无需编码，实现类Excel体验的交叉填报 - 活字格专区 - 专题教程 - 葡萄城产品技术社区 (grapecity.com.cn)

高深的知识，不知道怎么玩的，问下能解决动态多列头的问题吗

amtath 发表于 2022-1-11 14:30
来自2022的回眸。不明觉厉

来自2022的回眸。不明觉厉

感谢大家的支持~

收藏

bytcib 发表于 2019-11-29 16:25
果然是大神！牛！

解决了 就好

Eric.Liang 发表于 2019-11-29 16:04
这是因为spreadJS在加载的时候页面还没有被完全渲染完成
需要在页面加载命令中添加一个事件
https://he ...

果然是大神！牛！

bytcib 发表于 2019-11-29 15:08
再次感谢您的支持与帮助，我们已经顺利做出了“嵌入法-活字格内嵌spreadjs”想要实现的效果，将spreadjs ...

这是因为spreadJS在加载的时候页面还没有被完全渲染完成
需要在页面加载命令中添加一个事件
https://help.grapecity.com.cn/pages/viewpage.action?pageId=23593954

1. $jq_sinf = $("[fgcname='sinf']"); //获取合并单元格所在jQuery 对象
   
2. $jq_sinf.children().remove();//因为活字格的DIV是多层DIV,实例化时把子元素移除就行了
   
3. jq_sinf = $jq_sinf[0]; //将jQuery 对象转换为dom 对象
   
4. //var spread = new GC.Spread.Sheets.Workbook(jq_sinf);//将对象传参来实例化spreadJS
   
5. spread = new GC.Spread.Sheets.Workbook(jq_sinf);
   
6. initSpread(spread);
   
7. //document.getElementById("r1c24p").setAttribute("type","file");
   
8. //先将chose_file的type设为file
   
9. 
   
10. 
    
11. //获取当前页面
    
12. var page = Forguncy.Page;
    
13. //绑定页面事件
    
14. page.bind("pageDefaultDataLoaded", function (arg1, arg2) {
    
15.         spread.refresh();
    
16. });

复制代码

Eric.Liang 发表于 2019-11-28 16:01
别客气哈~

不好意思，忘记了将工程文件上传
demo

项目文件