PDA

View Full Version : Combobox filter issue



sandy52
11 May 2014, 8:19 PM
Hi all,
I am facing problem for filter combobox data, I have two combobox which has same store, i am filtering combo box store on selection like if in first combobox value is selected that values will not be show in second combobox and if in second combobox value is selected that value will not be available in first combobox. But at first time when selecting value in first or second combo box it not filter the data when second time select the value then it filter the store.
my code is :


this.choiceSetStore = Ext.create('HO.store.ChoiceCategoryData', {
filters: [
{id:'ActiveRecord',property:'Active',operator:'eq',value:1,disabled:false}
]
});
this.SubChoiceSetStore = Ext.create('HO.store.ChoiceCategoryData', {
filters: [
{ id: 'ActiveRecord2', property: 'Active', operator: 'eq', value: 1, disabled: false }
]
});
this.items=[
{
xtype: 'combobox',
id: 'ChoiceCategoryData',
fieldLabel: 'Is Part of This Choice Sets',
name: 'ChoiceCategoryData',
store: this.choiceSetStore,
valueField: 'Id',
displayField: 'ChoiceCategoryName',
editable: false,
emptyText: 'Choice Set',
typeAhead: false,
multiSelect: true,
queryMode: 'local',
forceSelection: false,
listeners: {
afterRender: function (me, eOpts, erec) {
var getVal = editView.getRecord();
if (getVal == undefined)
{ return; }
else {
var perms = getVal.raw.ChoiceCategoryData;
if (perms == undefined) {
return;
}
var permsArray = new Array();
for (var i = 0; i < perms.length; i++) {
if (perms[i]) permsArray.push(perms[i].Id);
}
this.setValue(permsArray);
}
},
setRawValue: function (value) {
console.log('setRawValue: ' + value);
var me = this;
value = Ext.value(me.transformRawValue(value), '');
var splitstr = value.split(',');
Ext.each(splitstr, function (str) {
if (Ext.isNumeric(str)) {
value.replace(str, '');
}
});
if (value == '[Multiple]') {
me.rawValue = null;
} else {
me.rawValue = value;
}
// Some Field subclasses may not render an inputEl
if (me.inputEl) {
me.inputEl.dom.value = value;
}
return value;
},
select: function (thisCombo, records, eOpts) {
var currentView = thisCombo.up('panel'),
cmbChoiceSet = currentView.down("combobox[name=ChoiceCategoryMenuItem]"),
choiceSetArray = [];
if (records) {
Ext.each(records, function (item, index, allItems) {
choiceSetArray.push(parseInt(item.data.Id));
});
}
// cmbChoiceSet.clearValue();
var ChoiceSetStore = cmbChoiceSet.getStore();
ChoiceSetStore.filterBy(function (item, id) {
if (Ext.Array.contains(choiceSetArray, parseInt(item.data.Id))) {
return false;
} else
return true;
});
}
}
}, {
xtype: 'combobox',
id: 'ContainChoiceSet',
fieldLabel: 'Has these Sub-Choice Sets',
name: 'ChoiceCategoryMenuItem',
store: this.SubChoiceSetStore,
valueField: 'Id',
displayField: 'ChoiceCategoryName',
editable: false,
emptyText: 'Contain Choice Set',
afterLabelTextTpl: '<div style="font-family:Arial;font-size:12px;color:#9b9b9b;padding:5px;">This Choice Sets appear whenever this choice is selected. </div>',
typeAhead: false,
multiSelect: true,
queryMode: 'local',
forceSelection: false,
listeners: {
afterRender: function (me, eOpts, erec) {
var getVal = editView.getRecord();
if (getVal == undefined)
{ return; }
else {
var perms = getVal.raw.ChoiceCategoryMenuItem;
if (perms == undefined) {
return;
}
var permsArray = new Array();
for (var i = 0; i < perms.length; i++) {
if (perms[i]) permsArray.push(perms[i].Id);
}
this.setValue(permsArray);
}
},
setRawValue: function (value) {
// console.log('setRawValue: ' + value);
var me = this;
value = Ext.value(me.transformRawValue(value), '');
var splitstr = value.split(',');
Ext.each(splitstr, function (str) {
if (Ext.isNumeric(str)) {
value.replace(str, '');
}
});
if (value == '[Multiple]') {
me.rawValue = null;
} else {
me.rawValue = value;
}
// Some Field subclasses may not render an inputEl
if (me.inputEl) {
me.inputEl.dom.value = value;
}
return value;
},
select: function (thisCombo, records, eOpts) {
var currentView = thisCombo.up('panel'),
cmbChoiceSet = currentView.down("combobox[name=ChoiceCategoryData]"),
choiceSetArray = [];
if (records) {
Ext.each(records,function (item, index, allItems) {
choiceSetArray.push(parseInt(item.data.Id));
});
}
// cmbChoiceSet.clearValue();
var ChoiceSetStore = cmbChoiceSet.getStore();
ChoiceSetStore.filterBy(function (item, id) {
if (Ext.Array.contains(choiceSetArray, parseInt(item.data.Id))) {
return false;
} else
return true;
});
}
}
},
];


Please help me out.

Thanks and regards,
sandy

jsakalos
11 May 2014, 11:19 PM
You need to create separate instances of the store for each combobox.

sandy52
12 May 2014, 1:49 AM
I have created two different variable which contain same store choiceSetStore and subChoiceSetStore

jsakalos
12 May 2014, 2:05 AM
These are not two different stores, they are only two names for the same thing.

sandy52
12 May 2014, 8:50 PM
okay, so i have to create two different store for same data

jsakalos
12 May 2014, 11:21 PM
Exactly.

sandy52
13 May 2014, 12:48 AM
thanks for the suggestion