JsonでDoJo拡張グリッドを実装

Question

私はDoJo Enhanced GridをJsonで実装しようとしていますが、これまで成功していません。

これは私がこれまで行ってきたことです。

<?xml version="1.0" encoding="UTF-8" standalone="no"?> 
<div xmlns:jsp="http://java.sun.com/JSP/Page" xmlns:util="urn:jsptagdir:/WEB-INF/tags/util" xmlns:spring="http://www.springframework.org/tags" version="2.0"> 
<jsp:output omit-xml-declaration="yes"/> 
<spring:url value="/students/listdata" var="mydatasource"/> 

<script type="text/javascript"> 
    dojo.require("dojo.parser"); 
    dojo.require("dojox.grid.EnhancedGrid"); 
    dojo.require("dojox.grid.enhanced.plugins.IndirectSelection"); 
    dojo.require("dijit.form.Button"); 
    dojo.require("dojo.data.ItemFileReadStore"); 
    dojo.addOnLoad(function() { 
     dojo.parser.parse(); 
     loadGrid(dataGrid); 
    }); 

    function loadGrid(dataGrid) { 
     dojo.xhrGet({ 
      url: "${mydatasource}", 
      load: function(data, ioArgs) { 
       dataGrid.setStore(
         new dojo.data.ItemFileReadStore(
          {data: {items : data}}) 
       ); 
      }, 
      error: function(error) { 
       console.log("loading of grid data failed. Exception...", error); 
      } 
     }); 
    } 
</script> 
<util:panel id="titlePane" title="Course List"> 
    <div id="addButton" dojoType="dijit.form.Button"> 
     Add 
    </div> 
    <div id="deleteButton" dojoType="dijit.form.Button"> 
     Delete 
    </div> 

    <div id="grid" jsId="dataGrid" dojoType="dojox.grid.EnhancedGrid" 
     structure ="[ 
         { field: 'id', name: 'ID', width: '55px' }, 
         { field: 'firstName', name: 'First Name', width: '230px' }, 
         { field: 'lastName', name: 'Last Name', width: '50px' }, 
         { field: 'gender', name: 'Gender', width: '145px'} 
        ]" 
     autoWidth="true" 
     autoHeight="true" 
     plugins="{indirectSelection: true}" 
     selectionMode="single"> 
    </div> 
</util:panel> 

あなたが見ることができるように、私はDOJOによるAJAX呼び出しを経由して、JSON文字列を取得しています。グリッドは生成されていますが、データが入力されていません。グリッドには2つのチェックボックスしか表示されません...

私が間違っていることはありますか？

Answer 1

データをロードしないグリッドに問題を見つけました。

実際には、データをJson Stringとして処理する必要がありました。

以下

は動作するコードのコピーです：

<script type="text/javascript"> 
    dojo.require("dojo.parser"); 
    dojo.require("dojox.grid.EnhancedGrid"); 
    dojo.require("dojox.grid.enhanced.plugins.IndirectSelection"); 
    dojo.require("dijit.form.Button"); 
    dojo.require("dojo.data.ItemFileReadStore"); 
    dojo.addOnLoad(function() { 
     dojo.parser.parse(); 
     loadGrid(dataGrid); 
    }); 

    function loadGrid(dataGrid) { 
     dojo.xhrGet({ 
      url: "${mydatasource}", 
      handleAs: "json", 
      load: function(data, ioArgs) { 
       dataGrid.setStore(
         new dojo.data.ItemFileReadStore(
          {data: {items : data}}) 
       ); 
      }, 
      error: function(error) { 
       console.log("loading of grid data failed. Exception...", error); 
      } 
     }); 
    }   
</script> 

Answer 2

私はEnhancedGridを一度も使用していませんが、通常のグリッドでは宣言的にストアを作成し、そのIDをグリッドに（HTMLのstore = ...属性を使用して）添付してから、呼ばれる、新しい店舗情報とグリッドをリフレッシュ：

grid.setStore(...,null,null);