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 に答える