Extjs 实现下拉框多选

{
    fieldLabel:'多选下拉框',
    triggerAction:'all',
    id:'multiselect',
    name:'multiselect',
    xtype: 'combo',
    width:100,
    emptyText:'请选择',
    store:manStore,
    mode:'local',
    valueField:'value',
    displayField:'value',
    //editable:false,
    frame:true,
                                  
    typeAhead: true,
    tpl:'<tpl for="."><div class="x-combo-list-item"><span><input type="checkbox" {[values.check?"checked":""]} value="{[values.value]}" /></span><span >{value}</span></div></tpl>',
    selectOnFocus:true,
    //value:'',
    //applyTo: 'local-states',
    onSelect : function(record, index){
        if(this.fireEvent('beforeselect', this, record, index) !== false){
            record.set('check',!record.get('check'));
            var str=[];//页面显示的值
            var strvalue=[];//传入后台的值
            this.store.each(function(rc){
                if(rc.get('check')){
                    str.push(rc.get('value'));
                    strvalue.push(rc.get('value'));
                }
            });
            this.setValue(str.join());
            this.value=strvalue.join();
            //this.collapse();
            this.fireEvent('select', this, record, index);
                                    
        }
    }
}

 

参考资料： extjs多选下拉框 http://www.studyofnet.com/news/428.html

 

转载自：https://www.douban.com/note/350898530/