ExtJS的Combobox的赋值问题

找Extjs的bug跟掘坟似得！特别是每次版本更新之后……

Extjs自从商业化之后GPL版本的下载地址越来约难找了，这里给一个现在还能访问的地址：https://www.sencha.com/legal/gpl/

免费的Extjs下载的话如果链接失效教大家一个方法，就是在 https://www.sencha.com 官方网站的右上角的搜索栏中搜索gpl然后就可以找到了

用了Extjs很久很久了很多东西还得查看API，后来想想居然连Combobox的赋值都记不得了，这个是最简单的赋值方式

 var cb1 = Ext.create('Ext.form.field.ComboBox', {
                renderTo: Ext.getBody(),
                fieldLabel: '测试数据1'
            });
            cb1.setValue("a");

或者以下这种默认赋值的方式

var cb2 = Ext.create('Ext.form.field.ComboBox', {
                renderTo: Ext.getBody(),
                fieldLabel: '测试数据2',
                value: "b"
            });

Store的赋值方式，但这种赋值方式必须有valueField和displayField两个字段

var store4 = Ext.create('Ext.data.Store', {
                data: datas
            });
            var cb4 = Ext.create('Ext.form.field.ComboBox', {
                renderTo: Ext.getBody(),
                fieldLabel: '测试数据4',
                valueField: 'id',
                displayField: 'name',
                store: store4,
                value: datas[0]['id']
            });

这里呢使用的是默认赋值value属性的方式，注意这个value必须是valueField的值，或者使用以下API方式赋值

cb4.setValue(datas[0]['id']);

这种默认赋值方式同样的也必须是valueField的值

以上赋值都是再已知的data的情况下，如果data是动态更新的且不确定，比如使用 queryMode: ‘remote’的方式动态查询的，这种情况就比较复杂，方式很多原理就是再store.load()之后store.add(data)把默认值假如到store中然后在设置combobox.setValue(datas[‘id’])就可以了，一般情况下可以在load事件里做，当然我在实际使用中遇到的更为棘手的问题(看注释)：

//这里的data是要赋值的默认值，defaultPostId是其他关联的组件的默认值不用管
setUserStore: function (data, defaultPostId) {
        var copanel = this,
            d = data;
        var info = JController.APIUser.getSearchMembers().info();
        var store = Ext.create('Ext.data.Store', {
            fields: ['id', 'name', 'nick', 'showName'],
            proxy: {
                type: 'ajax',
                url: info.url,
                extraParams: info.param
            },
            listeners: {
                //这个事件在store.add 、 combobox.setValue 、 store.load都会触发
                datachanged: function (me, o) {
                    var count = me.count();

                    //所以这里是把默认值假如store然后返回
                    if (data) {
                        data = null;
                        me.add(d);
                        return;
                    }
                    //这里呢是吧store的选中值设置为默认值data然后返回
                    if (d) {
                        copanel.find('userId').setValue(d['id']);
                        d = null;
                        return;
                    }
                    //如果不用return的话会导致以下代码多次执行

                    for (var i = 0; i < count; i++) {
                        var record = me.getAt(i);
                        record.set('showName', record.get('name') + ' ( ' + record.get('nick') + ' ) ')
                    }

                    copanel.initPostRadioGroup(defaultPostId);
                }
            }
        });
        store.load();
        this.find('userId').bindStore(store);
    },

当然这里是我的解决方式，仅供参考

ExtJS的Combobox的赋值问题

猜你喜欢