Dojo 网格嵌套 json [英] Dojo grid nested json
问题描述
我想要一个连接到输出以下 json 的服务器 url 的 dojo 网格:{标识符:id"项目:[{id:1",姓名:John",大学:{姓名:XXX",地址:YYY"}}].
I'd like to have a dojo grid which connects to a server url which outputs the following json : {identifier : "id" items : [ { id: "1", name: "John", university : { name: "XXX", address: "YYY" } }].
基本上我有一个嵌套的 json.我想将大学名称和大学地址表示为网格中的单独列.
Basically I have a nested json. I would like to represent the university name and University address as separate columns in the grid.
我尝试使用 dojox.grid.DataGrid 对象并创建网格布局,但不知道如何引用嵌套元素,并且 university.name 和 university.address 似乎不起作用.我正在使用 dojo 1.6.1.
I tried using the dojox.grid.DataGrid object and creating a gird layout, but do not know how to refer to the nested elments and university.name and university.address don't seem to work. I am using dojo 1.6.1.
有人指点吗?
这是我使用的js代码:
This is the js code I use :
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileReadStore");
dojo.addOnLoad(function(){
// our test data store for this example:
var jsonStore = new dojo.data.ItemFileReadStore({
url: '/MainDeployer/ajax/users/get.json'
});
var layoutUsers = [
[{
field: "name",
name: "Name",
width: 10
},
{
field: "university.name",
name: "University Name",
width: 10
},
{
field: "university.address",
name: "University Address",
width: 'auto'
}]];
// create a new grid:
var grid = new dojox.grid.DataGrid({
query: {},
store: jsonStore,
clientSort: true,
rowSelector: '20px',
structure: layoutUsers
},
document.createElement('div'));
dojo.byId("usersTable").appendChild(grid.domNode);
grid.startup();
});
谢谢,克里斯蒂安
推荐答案
你用的是什么商店?看看 dojo.data.ItemFileReadStore 文档,有一个像你这样的例子:http://dojotoolkit.org/reference-guide/dojo/data/ItemFileReadStore.html#item-structure
What kind of store are you using? Have a look at the dojo.data.ItemFileReadStore documentation, there is an example with a situation like yours: http://dojotoolkit.org/reference-guide/dojo/data/ItemFileReadStore.html#item-structure
这将帮助您通过一次调用fetch"方法来获取所有项目.如果由于某些原因它由于不同的 json 结构而无法工作,您可以继续使用 ItemFileReadStore ,并创建一个循环遍历 json 中所有对象的函数,并使用 loadItem 方法以这种方式逐个添加项目(它不漂亮,但它有效):
This would help you fetching all the items with a single call to the method "fetch". If for some reasons it doesn't work due to the different json structure, you can continue using ItemFileReadStore , and create a function that loops over all the objects in your json and uses the loadItem method for adding items one by one in this way (it's not beautiful but it works):
var myData = {"items" : []};
var myStore = new dojo.data.ItemFileWriteStore({data: myData});
var myLayout = [{
field: 'name',
name: 'Name',
width: '200px'
},
{
field: 'universityName',
name: 'University Name',
width: '100px'
},
{
field: 'universityAddress',
name: 'University Address',
width: '60px'
}];
var myGrid;
dojo.addOnLoad(function(){
myGrid = new dojox.grid.DataGrid({
store: myStore,
structure: myLayout
}, document.createElement('div'));
dojo.byId("myGridContainer").appendChild(myGrid.domNode);
myGrid.startup();
dojo.xhrGet({
url: myURL,
handleAs: "json",
headers: {
"Content-Type": "application/json; charset=uft-8",
"Accept" : "application/json"
},
load: function(responseObject, ioArgs) {
myList = responseObject;
dojo.forEach(myList.items, function(element) {
myStore.newItem({"name": element.name,
"universityName": element.university.name,
"universityAddress": element.university.address});
});
})
});
}
这篇关于Dojo 网格嵌套 json的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!