0

我想使用 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>
4

1 回答 1

0

您的标签内的<script>代码（具有“src”）永远不会运行。有关如何以 AMD 方式引入连接模块的信息，请参见dojo/_base 文档

这应该工作

 <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>
于 2012-08-05T16:50:42.303 回答