PDA

View Full Version : Populate Combo box with start and end index



ramgupta.golden
1 Sep 2011, 10:04 PM
My form having two extjs combo box. Combo1 and Combo2
Combo1 items: [1,Mumbai],[2,Pune],[3,Nagpur],[4,Gwalior],][5,Morena],[6,Datia],[7,Bhopal]
Combo2 items: [m,Maharastra],[mp,Madhya Pradesh]
if(Combo2.getRawValue() == "Maharastra")
{
// from index 0 to 2
then in Combo1 [1,Mumbai],[2,Pune],[3,Nagpur],[4,Gwalior],] should be dispalay
}
if(Combo2.getRawValue() == "Madhya Pradesh")
{
from index 3 to 6
then in Combo1 [5,Morena],[6,Datia],[7,Bhopal] should be dispalay
}

please let me know if anyone know the solution.

Thanks & Regards'
Ram

skirtle
3 Sep 2011, 11:06 AM
Lots of options for how to do it depending on exactly how the user interaction should work. Here's one example:


var combo1 = new Ext.form.field.ComboBox({
editable: false,
forceSelection: true,
lastQuery: '', // Stop initial filtering being cleared
renderTo: Ext.getBody(),
store: [
[1, 'Mumbai'],
[2, 'Pune'],
[3, 'Nagpur'],
[4, 'Gwalior'],
[5, 'Morena'],
[6, 'Datia'],
[7, 'Bhopal']
]
});

new Ext.form.field.ComboBox({
editable: false,
forceSelection: true,
otherCombo: combo1,
renderTo: Ext.getBody(),
value: 'm', // Ensure an initial selection
filterOtherCombo: function() {
// 4.0.2 doesn't have getStore(), later versions do
var store = this.otherCombo.store;

// Remove the previous filter
store.clearFilter();

var range;

if (this.getValue() === 'm') {
range = store.getRange(0, 3);
}
else {
range = store.getRange(4, 6);
}

store.filterBy(function(record) {
return Ext.Array.contains(range, record);
});

// Clear the value, it won't be in the list any more
this.otherCombo.setValue('');
},
listeners: {
change: function() {
// Filter when the value changes
this.filterOtherCombo();
},
render: function() {
// Initial filtering
this.filterOtherCombo();
}
},
store: [
['m', 'Maharastra'],
['mp', 'Madhya Pradesh']
]
});