showing all fields in a Dojo Data Grid with dojo.store.JsonRest
I have a Dojo Data Grid for displaying contact information that is showing values for only two columns: "model" and "pk". The other columns are blank, probably because the JSON response from the server puts the other name/value pairs inside of "fields":
[{"pk": 1, "model": "accounting.contacts", "fields": {"mail_name": "Andy", "city": "Grand Rapids", "zip": "49546", "country": "US", "state": "MI"}}]
What is the best way to get all my fields to show up in the grid?
Here's the relevant view in Django:
def contacts(request):
json_serializer = serializers.get_serializer("json")()
json_contacts = json_serializer.serialize(Contacts.objects.all(), ensure_ascii=False)
return HttpResponse(json_contacts, mimetype="appl开发者_如何学Pythonication/json")
And here's my Dojo page:
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.xd.js"
data-dojo-config="isDebug: true,parseOnLoad: true">
</script>
<script type="text/javascript">
dojo.require("dojo.store.JsonRest");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ObjectStore");
dojo.ready(function(){
objectStore = new dojo.store.JsonRest({target:"/contacts/"});
//alert(objectStore);
dataStore = new dojo.data.ObjectStore({objectStore: objectStore});
//alert(dataStore);
layoutGridContacts = [{
field: 'mail_name',
name: 'Name',
width: '200px'
},
{
field: 'model',
name: 'DB Table',
width: '100px'
...
}];
gridContacts = new dojox.grid.DataGrid({
query: {
name: '*'
},
store: dataStore,
clientSort: true,
structure: layoutGridContacts
}, dojo.byId("containerGridContacts"));
gridContacts.startup();
});
</script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/claro.css" />
<style type="text/css">
@import "http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojox/grid/resources/Grid.css";
@import "http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojox/grid/resources/claroGrid.css";
.dojoxGrid table {margin: 0; } html, body { width: 100%; height: 100%;
margin: 0;}
</style>
</head>
<body class="claro">
<div id="containerGridContacts" style="width: 100%, height: 100%;">
</div>
</body>
Thanks.
This is really a question of, "How do I interact with a javascript object?" Given the JSON in your question, and assuming you assigned it to the variable obj, you could access mail_name with obj[0]['fields']['mail_name'] or using dot notation, obj[0].fields.mail_name. I haven't used Dojo, but I'd wager you just need to set fields.mail_name as the field in layoutGridContacts.
I was able to get the server to produce a JSON response that does not contain nested objects, so the Dojo Store was able to use it. To do this I changed my view to:
def contacts(request):
all_contacts = list(iter(Contacts.objects.values()))
json_contacts = simplejson.dumps(all_contacts)
return HttpResponse(json_contacts, mimetype="application/json")
Use "fields." in front of your field identifier to access the properties inside fields:
layoutGridContacts = [{
field: 'fields.mail_name',
name: 'Name',
width: '200px'
},
...
You can use formatter method to retrieve the data. For your example it will be something like below
{name:"Name",
field: "fields",
width: "20%",
cellStyles:"background-color:#e3690b;",
formatter: function(field){
if(!field){return;}
return field.mail_name;
}
}
加载中,请稍侯......
精彩评论