折翼的飞鸟

导航

ExtJs获取选中的下拉列表值【一】

获取下拉列表的值,个人在项目中使用的是getValue()来获取设置在displayField属性上的值,getRawValue()来获取valueField属性上设置的值

displayField是隐藏的value值,valueField是在页面可以看到值即显示的文本值。

Ext.define("MyPanel", {
    /* 创建窗体控件 */
    CreatePanelCollect: function () {
        //请求数据
        var me = this; 
        var combo_store = Ext.create('Ext.data.Store', {
            fields: [ 'Item1','Item2'],
            data: [{id:"10001",value:"wind"}, {id:"10002",value:"小月"},{id:"10003",value:"凌清秀"},{id:"10004",value:"冷清雪"},{id:"10005",value:"望月"},{id:"10006",value:"布隆"}]
        }); 
        var comboBox = Ext.create('Ext.form.ComboBox', {
            fieldLabel: '选择链接',
            name:"myComboBox",
            store: combo_store,
            queryMode: 'local',
            displayField: 'id',
            valueField: 'value',
            width: 275,
            labelWidth: 70,
            style:"margin-bottom:50px;",
            emptyText : '--请选择--'  
        });

        return [comboBox];
    },

    /* 确定选择链接 */
    ChooseItemsFun: function () {
        //查询下拉列表的数据
        var comb = Ext.getCmp("myWindow").query("[name='myComboBox']")[0];  //通过属性name值来查询下拉控件
        var id = comb.getValue(),   //获取隐藏值
            value = comb.getRawValue(); //获取显示值
        //没有选择时,id值为空
        Ext.Msg.alert("提示",id+"---"+value);
    },
    
    //创建窗体
    CreateWindow: function () {
        var me = this; 
        //构建form组件
        var items = me.CreatePanelCollect();
        //构建窗体
        var win = Ext.create("Ext.window.Window", {
            title: "选择微信链接",
            id: "myWindow",
            width: 300,
            height: 150,
            shadow: true,
            modal: true,
            closable: true,
            layout: "fit",
            items: {
                xtype:"form",
                name:"myForm",
                items: items,
                style: "padding:20px 10px;",  
            },
            buttons: [
                {
                    text: "确定",
                    handler: function () {
                        me.ChooseItemsFun(); 
                    }
                }, {
                    text: "关闭",
                    handler: function () {
                        Ext.getCmp("myWindow").close();
                    }
                }
            ]
            
        }); 
        return win;
    }
});
var winClass = Ext.create("MyPanel")(); //创建声明的类
winClass.CreateWindow(); //调用创建窗体的函数
win.show();//显示窗体

 

posted on 2017-03-07 17:55  折翼的飞鸟  阅读(1498)  评论(0编辑  收藏  举报