码迷,mamicode.com
首页 > Web开发 > 详细

extjs下拉列表(二)

时间:2014-05-20 14:23:07      阅读:356      评论:0      收藏:0      [点我收藏+]

标签:extjs

最近看了看extjs,以前对这方面没有学习,只所以没有学习,听到别人说这个框架比较占用内存,最近用了几天时间在研究这,感觉不错。如果要是做简单的,建设用easyUi

       var st1 = new Ext.data.Store({
                fields: ["name", "id"],
                data: [
                    { name: "男", id: "1" },
                    { name: "女", id: "2" }
                ]
            });
        var w = new Ext.Window({
            height: 500,
            width: 500,
            title: "下拉列表控件",
            items: [
                {
                    xtype: "combobox",
                    store: st1,
                    displayField: "name",   //显示出来的是name 
                    valueField: "id",       //值是id
                    fieldLabel: "性别",     //label
                    labelWidth: 50,         //label宽度
                    editable: false,        //不可编辑
                    emptyText: "请选择...", //为空的时候显示的文字
                    id: "cboSex",           //id
                    listeners: {            //侦听事件,除了点击事件外,其它事件都是写在这里
                        select: function (c, b) { //选择事件
                            alert(Ext.getCmp("cboSex").getValue()); //这里拿到的是id
                        }
                    }
                }
            ]
        });
        w.show();


 var combo = new Ext.form.ComboBox({
            emptyText: ‘请选择山西城市‘,
            mode: ‘local‘,
            width: 100,
            triggerAction: ‘all‘,
            transform: ‘combo‘
        });
        var btn = new Ext.Button({
            text: "列表框的值",
            renderTo: Ext.getBody(),
            handler: function () {
                Ext.Msg.alert("城市", "实际值:" + combo.getValue() + ";显示值:" + combo.getRawValue());
            }
        });

     <select id="combo" class="center">
            <option value="dalian">太原</option>
            <option value="shenyang">晋城</option>
            <option value="dandong">长治</option>
            <option value="anshan">临汾</option>
        </select>  

有写的不好的地方,大家可以随时提出,多学习。

extjs下拉列表(二),布布扣,bubuko.com

extjs下拉列表(二)

标签:extjs

原文地址:http://blog.csdn.net/yancongmin0702/article/details/26162549

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!