combo选择框加载数据

选择框加载数据:尝试了combo ,链接viewsta.js有问题:只显示第一个字符,其中还有一些属性下面知识点没介绍到。

------------------------------------------

最终用下面方法完成:

1、 加onchange

<select style="width: 227px; font-size:12px;" id="groupName" name="groupName"  onchange="getNewData();"></select>

     

2、加Ajax异步数据传输:

function getNewData(){

//alert($("groupName").value+"~~!");

var t=$("groupName").value;

new Ajax.Request(

       '../statistics/viewstatistics.action?query=1&groupName='+encodeURI(encodeURI(t)),

       {

           method : 'post',

           onSuccess : function(transfer) {

           //alert("getnewData success");

           }

      });

}

----------------------------------------------------------------------------------------------

combo的知识点:

使用时,在items里,类型(xtype)设置成combo。

{

    xtype:'combo',

    store: new Ext.data.SimpleStore({

        fields: ["retrunValue", "displayText"],

        data: [

            [1,'小学'], [2,'初中'], [3,'高中'], [4,'中专'], [5,'大专'], [6,'大学']

        ]

    }),

    valueField :"retrunValue",

    displayField: "displayText",

    mode: 'local',

    forceSelection: true,

    blankText:'请选择学历',

    emptyText:'选择学历',

    hiddenName:'education',

    editable: false,

    triggerAction: 'all',

    allowBlank:false,

    fieldLabel: '学历',

    name: 'education',

    anchor:'90%'

}

在这里定义了一个store属性,就是选择值存储的地方,因为是在客户端的数据,所以使用了一个简单存储(SimpleStore)。

在存储里,通过一个数组定义了retrunValue和displayText两个字段。

retrunValue字段指定是提交给后台的值

displayText字段指定是在下拉中显示的选择值。

然后在data里定义了几组数据(data: [[1,'小学'],[2,'初中'],[3,'高中'],[4,'中专'],[5,'大专'],[3,'大学']]),可以看到,每组数据都是根据 fiedls的定义来组成的,数组里第一个值就是retrunValue的值,第二个值就是displayText的值,例如[1,'小学'],就表示 retrunValue是1,displayText是小学。下面就是很重要的一步了,设置下拉选择框的值和显示文本。

设置了下拉选择框的提交值对象的是存储中的retrunValue字段(valueField :"retrunValue"),显示文本是存储中的displayText字段(displayField: "displayText"),通过这两个设置就可将存储中的数据和下拉框对应起来。

因为数据是在本地,所以设置了模式为local(mode: 'local'),

该下拉列表只允许选择,不允许输入(editable: false),

而且是必须选择一个选项(forceSelection: true)。

在没有选择值时显示为选择学历(emptyText:'选择学历')。

提交form时,该项如果没有选择,则提示错误信息“请选择学历”(blankText:'请选择学历')。

该选项值不允许为空(allowBlank:false)。

要注意的是hiddenName和name属性,name只是改下拉的名称,作用是可通过,而hiddenName才是提交到后台的input的name。如果没有设置hiddenName,在后台是接收不到结构的,这个大家一定要注意。

因为这个下拉是只能选择的,所以一定要设置属性triggerAction为all,不然当你选择了某个选项后,你的下拉将只会出现匹配选项值文本的选择项,其它选择项是不会再显示了,这样你就不能更改其它选项了。

如果要为控件设置默认值,就设置属性value,value的值要设置为提交给后台的值,不要设置为显示文本。例如本例要设置大学为默认值,则设置value的值为6。

 

posted @ 2013-08-13 16:07  果汁果粒  阅读(588)  评论(0编辑  收藏  举报