Ext JS 4百強應用：ComboBox是什麼？怎麼使用？--第2強

Ext JS 的ComboBox是什麼？ 說白了，就是下拉列表+文本，只不過更豐富！

怎麼使用？

Ext.onReady(function () {
            var store = Ext.create("Ext.data.Store", {
                fields: ["abbr", "name"],
                data: [
                            { "abbr": "wbg", "name": "wubangguo" },
                            { "abbr": "wjb", "name": "wenjiabao" },
                            { "abbr": "hjt", "name": "hujintao" },
                            { "abbr": "lks", "name": "likeshan"}],
                sorters: ["abbr"]   //排序
            });
            Ext.create("Ext.form.ComboBox", {
                fieldLabel: "Choose Name",
                store: store,        //加載數據源
                queryMode: "local", //如果數據是在本地的話，最好使用這個選項，這樣就會有助於提高性能，默認情況是remote（注意在我們通過ajax請求返回數據到本地的store時也要使用local選項，因爲如果不這樣的話，就會多請求服務器一次）
                displayField: "name",
                valueField: "abbr",
                forceSelection: true, //只允許從下拉列表中進行選擇，不能輸入文本
                editable: false,     //不允許編輯，(默認爲true)
                multiSelect: true, //那麼這種情況就是允許選擇多個項，而且多個項也會顯示在combobox中（默認情況是false）
                listeners: {
                    scope: this,
                    "select": function (comboBox, record, index) {
                        Ext.Array.each(record, function (item) {
                            alert(item.get("name"));
                        });
                        alert(comboBox.getValue()); //這個是獲取value的不是獲取到顯示在哪裏的值
                    }
                },
                renderTo: Ext.getBody()
          });
});

多數情況下，我們是這麼用的，請看下面代碼：

        var dsAdminOrganizations = Ext.create('Ext.data.Store', {
            fields:[
                'id',
                'text'
            ],
            pageSize: CONF.GRID_PAGE_SIZE,
            proxy: {
                type: 'ajax',
                url : CONF.CONN_URL,
                extraParams: {
                    module: 'admin',
                    action: 'get_admin_organizations'
                },
                reader: {
                    type: 'json',
                    root: CONF.JSON_READER_ROOT,
                    totalProperty: CONF.JSON_READER_TOTAL_PROPERTY
                }
            },
            autoLoad: true
        });
    
        this.cboAdminOranizations = Ext.create('Ext.form.ComboBox', {
            fieldLabel: '<?php echo  lang('field_fd_organizationid'); ?>',
            labelWidth: 149,
            store: dsAdminOrganizations, 
            name: 'fd_organizationid', 
            queryMode: 'local',
            displayField: 'text', 
            valueField: 'id', 
            editable: false,
            forceSelection: true,      
            emptyText: '<?php echo  lang('none'); ?>'
        });