Loading Extjs grid from an XML string instead of file
I've been able to get ExtJS grids to create from external XML files. I usually define stores as follows:
var store = new Ext.data.Store({
model: 'PersonModel',
proxy: {
type: 'ajax',
url : 'MyXML.xml',
reader: {
type : 'xml',
record: 'Person'
}
}
});
I have an XML fragment stored in one of the fields, so let's just say I have it in a lo开发者_运维技巧cal variable. How can I implement the store to read from a variable/string and not from a file? Thanks.
I got it to work. The trick was to define a memory type proxy and then pass a parsed xml object to it.
var xmlstr = "<personRecord>" +
"<Person>" +
"<firstName>Stan</firstName>" +
"<lastName>C</lastName>" +
"</Person>" +
"<Person>" +
"<firstName>Stanley</firstName>" +
"<lastName>D</lastName>" +
"</Person>" +
"</personRecord>";
var doc;
if (window.ActiveXObject) { //IE
var doc = new ActiveXObject("Microsoft.XMLDOM");
doc.async = "false";
doc.loadXML(xmlstr);
} else { //Mozilla
var doc = new DOMParser().parseFromString(xmlstr, "text/xml");
}
var memstore = new Ext.data.Store({
autoLoad: true,
model: 'Person',
data : doc,
proxy: {
type: 'memory',
reader: {
type: 'xml',
record: 'Person'
}
}
});
I got it to work when I dropped the data: doc declaration inside the proxy. proxy: { data: doc type: 'memory' etc etc
EW
//this is the model we will be using in the store
Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{name: 'id', type: 'int'},
{name: 'name', type: 'string'},
{name: 'phone', type: 'string', mapping: 'phoneNumber'}
]
});
//this data does not line up to our model fields - the phone field is called phoneNumber
var data = {
users: [
{
id: 1,
name: 'Ed Spencer',
phoneNumber: '555 1234'
},
{
id: 2,
name: 'Abe Elias',
phoneNumber: '666 1234'
}
]
};
//note how we set the 'root' in the reader to match the data structure above
var store = new Ext.data.Store({
autoLoad: true,
model: 'User',
data : data,
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'users'
}
}
});
Refrence: http://docs.sencha.com/ext-js/4-0/#/api/Ext.data.proxy.Memory
I think something like this might work (admittedly I haven't tried it):
var data = "<user><name>Joe Bob</name></user>";
var store = new Ext.data.Store({
model: 'PersonModel',
data: data,
proxy: {
type: 'memory',
reader: {
type : 'xml',
record: 'Person'
}
}
});
You may also want to add autoLoad: true
in the store's options so you don't have to call store.load();
Edit: You may also want to consider changing the data a bit so it can be used by the array reader: http://docs.sencha.com/ext-js/4-0/#/api/Ext.data.reader.Array
You can load store with local variable using store.loadData(xmlVar);
精彩评论