IBM Worklight 5.0.6 - 无法添加外部 Dojo 组件（需要 Dojo Dgrid 时出现脚本错误）

Question

我已经下载了Dgrid，在 dgrid 中重命名了一个文件夹后，我将它移到了 Dojo 文件夹中。

在 HTML 中我这样包含它：

<!--application UI goes here-->
<script type="text/javascript" src="dgrid/Grid.js"></script><!--prova importazione Dgrid-->
<script src="js/initOptions.js"></script>
<script src="js/MobileACG.js"></script>

接下来我在 build_dojo.xml 中设置：

<include name="dgrid/Grid.js" /> 

错误在下面的require 行：

function creaGridTableArticoli(){
    dgrid
    require(["dgrid/Grid"], function(Grid){
        var columns = {
            first: {
                label: "First Name"
            },
            last: {
                label: "Last Name"
            }
        };
        var grid = new Grid({ /* options here */ }, "grid");
        WL.Logger.debug("ok");

    });

}

Answer 1

注意：关于 Dojo，IBM Worklight 仅支持用于运行时和工具的 IBM Dojo Toolkit。
IBM 相当于 dgrid is gridx。

也就是说，请按照以下步骤使 dgrid 在您的 Worklight 项目中工作。

1. Download dgrid
   • 解压，重命名文件夹为“dgrid”
2. Download xstyle
   • 解压，重命名文件夹为“xstyle”
3. Downlload put-selector
   • 解压缩，将文件夹重命名为“put-selector”
     
     

4. 在 Worklight 5.0.6 中

   • 创建一个新项目
   • 创建一个新的应用程序并确保勾选 Dojo 复选框在关闭向导之前将 Dojo 添加到项目中
   • 可选择添加 Android 环境
   • 将上面的三个文件夹放在属于项目的 dojo 文件夹的根目录下：
     
     

   
   

5. 打开 build-dojo.xml 并添加以下内容：

   <include name="dojo/_base/declare.js"/>
   <include name="dojo/domReady.js"/>
   <include name="dgrid/**"/>
   <include name="put-selector/*"/>
   <include name="xstyle/**"/>
   

6. 打开 HTML 文件并在 HEAD 元素内添加一个新的脚本标签。使用以下代码填充它：

      require(["dgrid/Grid", "dojo/domReady!"], function(Grid) {
          var data = [
            { first: "Bob", last: "Barker", age: 89 },
            { first: "Vanna", last: "White", age: 55 },
            { first: "Pat", last: "Sajak", age: 65 }
          ];
   
          var grid = new Grid({
            columns: {
                first: "First Name",
                last: "Last Name",
                age: "Age"
            }
          }, "grid");
   
          grid.renderArray(data);
      });
   

7. 在 BODY 元素中添加以下内容：
   <div id="grid"></div>

8. 全部构建并部署

9. Worklight Console 中的预览

   您也可以在 Eclipse 的设计透视图中进行预览，尽管我注意到表格中存在一些渲染问题（在 MBS 中没有看到（如下）；我想它可以在 CSS 中修复......）。

全尺寸图片：http://i.stack.imgur.com/B36qU.png