It is possible to have an combobox with two stores in Ext js 4.2? - extjs4

Question

I have to make a live search , and after hours spent on google I decided to ask here if anyone have an ideea how can I make an live search( using or not combobox) in Ext JS but (the triky part). I have 2 data sets . One data set from one URL and and second from another URL.
I dont know how to start or how can I make the request when I type something in my search box to return small data set first and when is completly loaded second data set ( is much bigger).
Something like when I type "computer" in search field in first block to show me some things related to computers (first request that have few data) after that in second block to show me more thing related to computer when request is over( second request lot of data).
I need this thing because in one of my request i have over 10 k product and i dont want to let user w8 until the request is done, and to show the other request that have fewer data. until the first is done.
I forgot to mention that i want to make both request in the same time and asynchronous.

Answer 1

My solution for exactly this kind of problem was:
Creating a store dedicated only for the combobox content.
When one of the two "source" stores loads data, they push the records into the combo-store.
You also have the reference between the records automatically, so if a record in source-store 1 or 2 is removed, it also disappears in your combostore- and so in your combobox, like magic! Here is the key, for pushing data on load in another store:
http://serversideguy.com/2012/01/31/ext-js-4-merging-store-data/
best regards, hope that helps, write if you need further sugggestion / info on this solution.

Answer 2

If the data is really vital, you can try loading up on memory when the application starts.
Create the stores you need on launch() of the app, load the data and the use it everywhere you want. You can do this on your controller launch() too, to your controller references and granulate this as you wish.
Ext.application({
name: 'Blog',
models: ['Post', 'Comment'],
controllers: ['Posts', 'Comments'],
launch: function() {
Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{name: 'firstName', type: 'string'},
{name: 'lastName', type: 'string'},
{name: 'age', type: 'int'},
{name: 'eyeColor', type: 'string'}
]
});
Ext.create('Ext.data.Store', {
model: 'User',
storeId: 'userStore',
proxy: {
type: 'ajax',
url: '/users.json',
reader: {
type: 'json',
root: 'users'
}
},
autoLoad: true
}); }
});