EXTJS 3.3 下来列表combox的多选方式

最新推荐文章于 2025-07-10 14:17:34 发布

zpryan

最新推荐文章于 2025-07-10 14:17:34 发布

阅读量1.4k

点赞数

分类专栏： ExtJS 3

ExtJS 3 专栏收录该内容

10 篇文章

订阅专栏

本文介绍了一个使用ExtJS框架实现的组合框配置案例，包括如何设置本地数据存储、触发动作、显示字段等属性，并展示了如何通过组合框选择项进行数据收集。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

tbar:[{
		text : "频道:"
       },
        	new Ext.form.ComboBox{
		id:"nextDayShowchannelid",
                name: "nextDayShowchannelid",
                store : new storeCombo({}),
                enableKeyEvents: true,
                typeAhead: true, 
                mode: 'local',  
                tpl:'<tpl for="."><div class="x-combo-list-item"><span><input type="checkbox" {[values.check?"checked":""]}  value="{[values.id]}" /></span><span >{name}</span></div></tpl>',  
                triggerAction: 'all',  
                displayField:'name',  
                valueField:'id', 
                frame:true,
                width:350,
                selectOnFocus:true,  
                onSelect : function(record, index){
                   	if(this.fireEvent('beforeselect', this, record, index) !== false){
                		record.set('check',!record.get('check'));  
               			var str=[];//页面显示的值            
               			var strvalue=[];//传入后台的值  
               			nextDayShowAjaxData="";
               			this.store.each(function(rc){  
                    		if(rc.get('check')){  
                        		str.push(rc.get('name'));  
                       			strvalue.push(rc.get('id')); 
                       			if(nextDayShowAjaxData!=""){
                       				nextDayShowAjaxData+=",";
                       			}
                       			 nextDayShowAjaxData +=rc.get('id');
                    	}  
                    		
                });  
                	this.setValue(str.join());  
                	this.value=strvalue.join();  
                	this.fireEvent('select', this, record, index);  
            }  
       	 } 
            })

设 nextDayShowAjaxData 为全局变量，可以通过nextDayShowAjaxData遍历最后选完所要选的check后；

nextDayShowAjaxData 在check之前必须设为空，否则会有每次会重复以前所选的