Ext.form.ComboBox简单用法

//二维数组,保存年份的值和文本,文本作显示用
var year = [['2005', '2005'], ['2006', '2006'], ['2007', '2007'],
        ['2008', '2008'], ['2009', '2009'], ['2010', '2010'],
        ['2011', '2011'], ['2012', '2012']];


//SimpleStore=Store+MemoryProxy+ArrayReader

var storeyear = new Ext.data.SimpleStore({
//在此创建了两列数据.第一列列名为value,用于存储值
//第二列列名为text,用于存储显示文本
          fields : ['value', 'text'],
          data : year
        });


var yearCombox = new Ext.form.ComboBox({
    fieldLabel : '目标年份',//标签


    //hiddenName :隐藏域名,用于指示生成表单隐藏域.如将hiddenName改为name,则在传值时会传文本的值
    hiddenName : 'year',
    store : storeyear,


    //displayField :显示文本.名字必须跟storeyear定义的field(即名为text)一样
    displayField : 'text',


    //valueField :值.名字必须跟storeyear定义的field(即名为value)一样
    valueField : 'value',
    typeAhead : true,


    //mode :值local表明yearCombox需要的数据已经读取到本地,不需要再去后台读取
    //mode默认值为remote,当值为remote时,会默认加载数据.可以设mode为local,然后手工加载数据storeyear.load()
    //如果设置为remote又使用了storeyear.load(),则会读取两次
    mode : 'local',


    //triggerAction :默认值为query,如果值为query,它会使用autoComplete(自动完成)功能
    //在输入时将不匹配的过滤掉.而值为all时将显示所有列表
    triggerAction : 'all',


    editable : false,//是否可编辑,类似于readOnly属性
    emptyText : '请选择',// 默认提示信息
    allowBlank : false,//是否允许空
    blankText : '不能为空,请选择有效信息',//错误提示信息
    msgTarget : 'under',//在该组件的下面显示错误提示信息
    selectOnFocus : true,
    width : 200 //该combobox组件的宽
});

posted @ 2010-08-27 16:43  Jamie  阅读(1693)  评论(0编辑  收藏  举报