Dojo1.7数据网格根据单元格中的文本更改行颜色



我想使用dojo工具更改每个单元格的数据网格背景颜色,但我正在尝试一些事情,但找不到正确的解决方案。

以下代码用于创建数据网格

 var myStore, dataStore, grid;
    require([
            "dojo/store/JsonRest",
            "dojo/store/Memory",
            "dojo/store/Cache",
            "dojox/grid/DataGrid",
            "dojo/data/ObjectStore",
            "dojo/query",
            "dijit/form/Button",
            "dojo/domReady!"
        ], function (JsonRest, Memory, Cache, DataGrid, ObjectStore, query) {
            myStore = Cache(JsonRest({ target: "/Blog/Action/", idProperty: "Id" }), Memory({ idProperty: "Id" }));
            grid = new DataGrid({
                store: dataStore = ObjectStore({ objectStore: myStore }),
                //  items:dataStore.items,
                structure: [
                    { name: "Blog Id", field: "Id", width: "50px", },
                    { name: "Name", field: "Name", width: "200px",classes:"Name" },
                    { name: "Phone Number", field: "Phone Number", width: "200px",classes:"test" }
                ]
            }, "grid"); // make sure you have a target HTML element with this id
            grid.startup();
            dojo.query("body").addClass("claro");
            grid.canSort = function () { return false };
        });

下面的代码试图根据所选值的索引更改颜色,但什么都没有发生,我的意思是没有错误,但它根本没有进入脚本。

 <script type="text/javascript" src="dojo/dojo.js" data-dojo-config="parseOnLoad: true">
       dojo.connect(grid, 'onStyleRow', this, function (row) {
        var item = grid.getItem(row.index);
        if (row.index == 0) {
            row.customClasses = "highlightRow";
            row.customStyles += 'background-color:#FFB93F;';
        }
    });
</script>

<script>标记中的代码(带有"src")永远不会运行。请参阅dojo/_base文档,了解如何通过AMD方式引入连接模块

这应该工作

 <script type="text/javascript" src="dojo/dojo.js" data-dojo-config="async:true, parseOnLoad: true"></script>

与网格挂钩

 <script type="text/javascript">
    require(["dojo/_base/connect"], function(connect) {
       connect.connect(grid, 'onStyleRow', this, function (row) {
          var item = grid.getItem(row.index);
          if (row.index == 0) {
             row.customClasses = "highlightRow";
             row.customStyles += 'background-color:#FFB93F;';
          }
       });    
    });
</script>

如果您通过标记声明网格,可以使用以下模式:

<div data-dojo-type="dojox.grid.DataGrid" data-dojo-props="???">
  <script type="dojo/method" event="onStyleRow" args="row">
        var item = grid.getItem(row.index);
        if (row.index == 0) {
            row.customClasses = "highlightRow";
            row.customStyles += 'background-color:#FFB93F;';
        } else {
             this.inherited(arguments);
        }
  </script>
</div>

相关内容

  • 没有找到相关文章

最新更新