功能描述:
现在有一个FormPanel,里面放入了5个Combobox下拉框,而且下拉框选项数据都是一些样的。
数据为:[[1,'一级'],[2,'二级'],[3,'三级'],[4,'四级'],[5,'五级']]
现在想实现一种效果就是让这5个下拉框选择的选项不能重复,比如第一个选中了一级,后面的
下拉框就没有一级这个选项了。(备注:用户每次可以选择任意一个下拉框,没有选择上的顺序)再次感谢。
现在有一个FormPanel,里面放入了5个Combobox下拉框,而且下拉框选项数据都是一些样的。
数据为:[[1,'一级'],[2,'二级'],[3,'三级'],[4,'四级'],[5,'五级']]
现在想实现一种效果就是让这5个下拉框选择的选项不能重复,比如第一个选中了一级,后面的
下拉框就没有一级这个选项了。(备注:用户每次可以选择任意一个下拉框,没有选择上的顺序)再次感谢。
var items, oriData = [ [ 1, '一' ], [ 2, '二' ], [ 3, '三' ], [ 4, '四' ],
[ 5, '五' ] ];;
function select(combo, record, index) {
//var thisData = []; //Ext.apply(thisData, oriData); //thisData.splice(index, 1);
oriData.splice(index, 1);
Ext.each(items,function(item,i,all){
var store = item.store;
if(i != combo.index)
store.loadData(oriData);
},this);}
Ext.onReady(function() { items = [ {
xtype : 'combo',
index : 0,
fieldLabel : 'c1',
store : new Ext.data.ArrayStore( {
data : oriData,
fields : [ 'value', 'label' ] }),
displayField : 'label',
typeAhead : true,
mode : 'local',
triggerAction : 'all',
selectOnFocus : true,
listeners : {
select : select,
scope : this
}
},{
xtype : 'combo',
index : 1,
fieldLabel : 'c2',
store : new Ext.data.ArrayStore( {
data : oriData,
fields : [ 'value', 'label' ] }),
displayField : 'label',
typeAhead : true,
mode : 'local',
triggerAction : 'all',
selectOnFocus : true,
listeners : {
select : select,
scope : this
}
},{
xtype : 'combo',
index : 2,
fieldLabel : 'c3',
store : new Ext.data.ArrayStore( {
data : oriData,
fields : [ 'value', 'label' ] }),
displayField : 'label',
typeAhead : true,
mode : 'local',
triggerAction : 'all',
selectOnFocus : true,
listeners : {
select : select,
scope : this
}
},{
xtype : 'combo',
index : 3,
fieldLabel : 'c4',
store : new Ext.data.ArrayStore( {
data : oriData,
fields : [ 'value', 'label' ] }),
displayField : 'label',
typeAhead : true,
mode : 'local',
triggerAction : 'all',
selectOnFocus : true,
listeners : {
select : select,
scope : this
}
},{
xtype : 'combo',
index : 4,
fieldLabel : 'c5',
store : new Ext.data.ArrayStore( {
data : oriData,
fields : [ 'value', 'label' ] }),
displayField : 'label',
typeAhead : true,
mode : 'local',
triggerAction : 'all',
selectOnFocus : true,
listeners : {
select : select,
scope : this
}
}]
var form = new Ext.FormPanel( {
renderTo : document.body,
title : '5 comboxes',
width : 400,
height : 400,
items : items
});
});