My data is originally stored in an xml file structured like this (with a bunch of entities, rows in each entity and cells in each rows)
<entity i=1>
<row i =1>
<cell i=1>
<cell i=2>
</row>
<row i=2>
<cell i=1>
<cell i=2>
</row>
</entity>
Example I read from the dojo tutorial is this:
require([
'dojo/store/Memory',
'gridx/Grid',
'gridx/core/model/cache/Sync'
], function(Store, Grid, Cache){
var store = new Store({
data: [
{id: 1, title: 'Hey There', artist: 'Bette Midler'},
{id: 2, title: 'Love or Confusion', artist: 'Jimi Hendrix'},
{id: 3, title: 'Sugar Street', artist: 'Andy Narell'}
]
});
......
});
How should I create the dojo store using XML stylesheet? Should I use embedded javascript in my XML stylesheet?
Well, you could use the dojo/query
module to iterate through your XML document. The only thing you have to do first is to parse your XML (if it isn't already), for example:
require([ "dojo/query", "dojox/xml/parser", "dojo/dom-attr" ], function(query, xml, domAttr) {
var content = xml.parse("<entity><row i=\"1\"><cell i=\"1\">Cell 1</cell><cell i=\"2\">Cell 2</cell></row><row i=\"2\"><cell i=\"1\">Cell 3</cell><cell i=\"2\">Cell 4</cell></row></entity>");
var out = query("row", content).map(function(node) {
var data = {};
query("cell", node).forEach(function(cell) {
data[domAttr.get(cell, "i")] = cell.textContent;
});
return data;
});
console.log(out);
});
This will result in an array of two objects where the value of the i
attribute is the property name and the text content of the <cell>
element is the value.
[{
"1": "Cell 1",
"2": "Cell 2"
}, {
"1": "Cell 3",
"2": "Cell 4"
}]
Which you can then use in a store.
Full example can be found on JSFiddle: http://jsfiddle.net/bUjN7/