excel 在Oracle APEX中集成JavaScript

vwkv1x7d  于 12个月前  发布在  Oracle
关注(0)|答案(1)|浏览(117)

我是新的Oracle APEX,我使用的顶点版本21.1.0,我只是想上传Excel文件与密码保护,所以我用传播JS JavaScript插件,而我试图整合我得到下面的错误,其中附在屏幕截图。

我有一个像下面这样的Oracle APEX表单:

我已经创建了一个区域和三个页面项目
1.文件上传类型-文件
1.密码输入类型-密码
1.按钮类型-按钮
页面属性如下:

我已经添加了下面的代码在HTML头

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" type="text/css" href="https://www.grapecity.com/spreadjs/demos/en/purejs /node_modules/@grapecity/spread-sheets/styles/gc.spread.sheets.excel2013white.css">
<script src="https://www.grapecity.com/spreadjs/demos/en/purejs/node_modules/@grapecity/spread-sheets/dist/gc.spread.sheets.all.min.js" type="text/javascript"></script>
<script src="https://www.grapecity.com/spreadjs/demos/spread/source/js/FileSaver.js" type="text/javascript"></script>
<script src="https://www.grapecity.com/spreadjs/demos/en/purejs/node_modules/@grapecity/spread-excelio/dist/gc.spread.excelio.min.js" type="text/javascript"></script>
<script src="https://www.grapecity.com/spreadjs/demos/en/purejs/node_modules/@grapecity/spread-sheets-charts/dist/gc.spread.sheets.charts.min.js" type="text/javascript"></script>
<script src="https://www.grapecity.com/spreadjs/demos/spread/source/js/license.js" type="text/javascript"></script>
<script src="https://www.grapecity.com/spreadjs/demos/spread/source/data/excel_data.js" type="text/javascript"></script>
<script type="text/javascript">
    window.onload = function () {
        var spread = new GC.Spread.Sheets.Workbook(document.getElementById("append"),  {calcOnDemand: true});
        spread.fromJSON(jsonData);
        var excelIo = new GC.Spread.Excel.IO();
        document.getElementById('B43349412666678933129').onclick = function () {
            var excelFile = document.getElementById("P2_UPLOAD_FILE").files[0];
            var password = document.getElementById('P2_PASSWORD').value;                                                
            // here is excel IO API
            excelIo.open(excelFile, function (json) {
                var workbookObj = json;                  
                    spread.fromJSON(workbookObj);
            }, function (e) {
                // process error
                alert(e.errorMessage);
                if (e.errorCode === 2/*noPassword*/ || e.errorCode === 3 /*invalidPassword*/) {
                    document.getElementById('P2_PASSWORD').onselect = null;
                }
            }, {password: password});
        };            
    };
   </script>
  </head>
 <body>
   <div id="append"></div>
 </body>

请纠正我,如果我错了或错过了什么。
谢谢你,

p5cysglq

p5cysglq1#

我是GrapeCity的一名技术参与工程师,支持JSJS。我想指出的是,在目前的版本(V14.1.0)中,它没有测试或使用APEX软件。如果您遇到任何问题,请在此处向我们的JavaScript团队报告:https://www.grapecity.com/my-account/my-support/
我能够按照以下步骤将JavaScript集成到APEX应用程序中:
1.我们必须首先包含JavaScript JS和CSS文件。在应用程序构建器中,选择呈现选项卡下的树中的根元素,然后在右窗格中向下滚动属性,直到找到JavaScript属性部分。
1.在JavaScript属性下,包含指定区域的JavaScript的JS和CSS文件url:

以下是必要的JavaScript链接:

JS:

1.接下来,创建一个名为CNOJS的区域
1.在JavaScript区域中,右键单击并创建以下内容:

  • 名为P1_UPLOAD_FILE的文件浏览器类型
  • 名为P1_PASSWORD的密码类型项目
  • 一个名为导入的按钮,静态ID为import,静态ID属性可以在高级属性下找到:

  • 一个名为ss的子区域,静态ID设置为ss

1.接下来,确保选择树的根元素并导航到右窗格中的JavaScript部分
1.在函数和全局变量声明部分初始化JavaScript。下面是我使用的一个代码片段,它将显示spreadjs到ss子区域,并使用按钮、文件浏览器和密码触发导入:

GC.Spread.Sheets.LicenseKey = "sjs-distribution key";
window.onload = function () {
    var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"), {calcOnDemand: true});
    var excelIo = new GC.Spread.Excel.IO();
      document.getElementById('import').onclick = function () {
        var excelFile = document.getElementById("P1_UPLOAD_FILE").files[0];
        var password = document.getElementById('P1_PASSWORD').value;
        // here is excel IO API
        excelIo.open(excelFile, function (json) {
            var workbookObj = json;
                spread.fromJSON(workbookObj);
            }
        , function (e) {
            // process error
            alert(e.errorMessage);
            if (e.errorCode === 2/*noPassword*/ || e.errorCode === 3 /*invalidPassword*/) {
                document.getElementById('password').onselect = null;
            }
        }, {password: password});
    };
}

正如我之前在我的帖子中分享的那样,请记住,JavaScript尚未在APEX应用程序中进行测试,因此可能会出现一些意外行为。如果您遇到任何问题,请联系PakeJS的团队!

相关问题