PDA

View Full Version : Single XML(Store) for multiple combos



vijaywadnere
18 Apr 2011, 12:32 AM
I have number of combo boxes on a FormPanel, which gets populated from an XML.

I've all the related records (properly arranged) in a single XML.

I've applied store: new Ext.data.XmlStore .. on each combo for same XML file on my server.

Current behavior: the "Same" xml file loaded separately (from server) for each combo box.

Question: Is there a way to have the XML loaded only once, and reuse the same store for different comboboxes (with different configurations, say 'readers') ?



<xml>
<rootforcombo1>
<combo1rec>
<key>1</key>
<value>value</value>
</combo1rec>
<combo1rec>
<key>2</key>
<value>value2</value>
</combo1rec>
</rootforcombo1>
<rootforcombo2>
<combo2rec>
<key>1</key>
<value>value</value>
</combo2rec>
<combo2rec>
<key>2</key>
<value>value2</value>
</combo2rec>
</rootforcombo2>
</xml>


{
...
xtype: 'combo',
valueField: 'key',
displayField: 'value'
store: new Ext.data.XmlStore({
url: "myxml.xml",
record: 'combo1rec',
autoLoad: true,
idPath: 'key',
fields: [
{name: 'key', mapping: 'key' },
{name: 'name', mapping: 'value'}
]
})
...
},
{
...
xtype: 'combo',
valueField: 'key',
displayField: 'value'
store: new Ext.data.XmlStore({
url: "myxml.xml",
record: 'combo2rec',
autoLoad: true,
idPath: 'key',
fields: [
{name: 'key', mapping: 'key' },
{name: 'name', mapping: 'value'}
]
})
...
}

KennethRusso
28 Apr 2011, 8:49 AM
Off the top of my head, I'd recommend:


Create one store manually, not as part of the configuration for the combos
Assign the store reference to the various combos
Monitor with something like firebug in firefox to ensure that the ajax call is only being made once
Doing a "new Store()" for each combo naturally means you're creating multiple objects, which just coincidentally are looking at the same data.

vijaywadnere
5 May 2011, 6:51 AM
Off the top of my head, I'd recommend:



Create one store manually, not as part of the configuration for the combos
Assign the store reference to the various combos
Monitor with something like firebug in firefox to ensure that the ajax call is only being made once

Doing a "new Store()" for each combo naturally means you're creating multiple objects, which just coincidentally are looking at the same data.

Well, its not the 'exactly same store' that I'd like to use with different combos.
I have one big XML, having multiple sections in it, I want to have multiple combos to populated by these different sections, but XML must be loaded only once.

While scanning forums I landed on this page: http://www.sencha.com/forum/showthread.php?65859-Simple-XML-parsing-with-ExtJS. This talks something close to what I need. It talks about using multiple readers. But so far I couldn't run it successfully. (May be the technique it uses is of 2.x).

KennethRusso
5 May 2011, 7:07 AM
I've had a similar situation where I only wanted to query for the data once and then create a variety of stores from the returned data, the whole "chunky vs. chatty" services API thing. I was using Json, which makes this pretty trivial as each store takes a "root".

So in this particular case I called a function and passed in a callback to execute once the data was successfully loaded (see load event of Ext.data.Store). In the callback I created the remainder of the stores I needed, using the same data (rawData property of the store's reader).

The "class" Ext.data.reader.Xml has a root configuration object so you can apply the same technique.

Mind you I have not actually done this in 4.0, but the technique worked fine in 3.x, so I may have goofed on some specifics, but the basic idea of having one store retrieve the server data and then having the other stores created from within the load event of the store is sound. There may be much better solutions, ymmv, etc.

Good luck.

vijaywadnere
6 May 2011, 1:29 AM
Oops! Just now I realized that I posted my question in wrong forum. Am using 3.x, so ideally this discussion must go in 3.x. (Don't know how to move it to correct location).

Anyways, today I tried various combination and finally managed to load single XML to create multiple store (yippie).



var conn = new Ext.data.Connection;
conn.request({
url: "path-to-my-xml.xml",
callback: function(options, success, response) {
if (success) {
var xml = response.responseXML;
myCallBack(xml);
}
}
});

function myCallBack(xml) {
var aStore = new Ext.data.XmlStore({
storeId: "store-id-1",
record: 'record1',
idPath: 'key',
fields: [
{name: 'id', mapping: 'key' },
{name: 'val', mapping: 'value'}
],
data: xml
});

var aReader = new Ext.data.XmlReader({
record: 'record-2',
idPath: 'key',
fields: [
{name: 'key', mapping: 'key' },
{name: 'name', mapping: 'value'}
]
});

var store2 = new Ext.data.Store({
storeId: "store-id-2",
reader: aReader,
data: xml
});
}

Hope someone someday will get benefited by this. :)

kamalt
29 Nov 2011, 2:28 PM
Hi,

We are using Sencha Touch 1.1 and tried your approach for creating multiple stores with single XML reader. But, we are getting "Uncaught TypeError: Function.prototype.apply: Arguments list has wrong type" error.

"data : xml" is the place where the exception is initiated.

Could you please provide the complete working sample?

Thanks,

Kamal T.