query on using two stores for a single Combobox

[victorymoon]

Hi Guys,

I am creating a combobox with two actions. One is while typing something on the combobox another is clicking the trigger on the combo box

Action #1. When a user types something i need to show matching results, when he select a result from the dropdown, he need to be redirected to that details page and the selected element (i.e) searched string has to be saved in the local storage for listing recently search items

Action #2. When you click, on the trigger button which is available in the combobox, i need show the data list, which are the recently searched by the user.

I am facing the issue while switching two stores. i can update the stores but the data items is not getting listed after the updation.

Any idea on this?

Below is the code for switching back the stores.



Ext.define('abc.view.account.AccountSearchField', {
extend: 'abc.component.GroupingComboBox',
alias: 'widget.accountSearchField',
inject: ['accountSearchLocalStore','accountStore'],
minChars : 5,
enforceMaxLength: true,
maxLength : 30,
anyMatch: true,
groupField: ['searchTypeDesc'],// string or array
valueField: 'accountId',
displayField: 'accountNm',
queryMode: 'remote',
typeAhead: true,
hideTrigger: false,
emptyText: 'Account Lookup',
multiSelect: false,
allowBlank: true,
enableKeyEvents: true,
listeners: {
'beforequery': function(qe) {
},
render:function(){
console.log('Before Render' + this);
Ext.select('.x-form-arrow-trigger').on('click',function() {
});

},
expand:function(){
},
blur: function(){
this.store = this.ownerCt.accountSearchLocalStore;
},
focus: function(){
},
select:function() {
this.store = this.ownerCt.accountSearchLocalStore;
this.store.load();
this.store.add({accountNm: this.lastValue});
this.store.sync();
console.log('!!Local Data added!!');
console.log(this.store);
},
change: function(){
this.store= this.ownerCt.accountStore;
console.log('!!on type added!!');
console.log(this.store);
console.log('!!on type ended!!');
},
keydown:function(){

}
},

features: [{ftype:'grouping'}],

listConfig: {
loadingText: 'Searching...',
emptyText: 'No matching posts found.',

// Custom rendering template for each item
getInnerTpl: function() {
return '<div class="search-item">' +
'<h3>{searchTypeDesc}</h3>' +
'<div>{accountNm}</div>' +
'</div>';
}
}
});

[scottmartin]

See if this will help. You need to set store before list is created:



var states1 = Ext.create('Ext.data.Store', {
fields: ['abbr', 'name'],
data : [
{"abbr":"AL", "name":"Alabama"},
{"abbr":"AK", "name":"Alaska"},
{"abbr":"AZ", "name":"Arizona"}
]
});

var states2 = Ext.create('Ext.data.Store', {
fields: ['abbr', 'name'],
data : [
{"abbr":"XX", "name":"xx-state"},
{"abbr":"YY", "name":"yy-state"},
{"abbr":"ZZ", "name":"zz-state"}
]
});

// Create the combo box, attached to the states data store
Ext.create('Ext.form.ComboBox', {
fieldLabel: 'Choose State',
store: states1,
queryMode: 'local',
displayField: 'name',
valueField: 'abbr',
renderTo: Ext.getBody(),
listeners: {
beforequery: function(queryEvent, opts) {
queryEvent.combo.store = states2;
}
}
});


Scott.

[victorymoon]

Hi Scott,

Thanks a lot for your reply, Here my store is changing properly. but the data items is not getting reflected / refreshed :(
For instance on beforequery am changing my store to local storage data. when i search something on the text field in that combobox, am able to fetch the json details, but the json details is not getting reflected on my combobox. still its showing the same data of local storage.