Sencha Touch 下拉列表 selectfield 的使用

定義一個下拉列表:

xtype : 'selectfield',
label : '這是下拉列表',
labelWrap : true,//自動換行
displayField:"newText",//默認爲text
valueField:"newValue", //默認爲value
options : [
    {
        newText : 'newtext1',
        newValue : 'newValue1'
    },
    {
        newText : 'newtext2',
        newValue : 'newValue2'
    },
],

listeners : {
    change : {// 內容改變

        fn : function(obj, newValue, oldValue, eOpts) {
        //這裏添加你的值改變事件要執行的動做
        }
    }
}

newText和newValue是下拉列表對應的顯示字符串和顯示字符串所對應的值，默認爲text和value，主要是用來處理與服務器傳來的數據源對應的名字對應；

數據源能夠是數組和store,其中數組對應爲options；

奇怪的是Sencha Touch 並未提供獲取顯示字符串的方法，固然須要得到顯示字符串的這種需求也確實少見。不過以備不時之需，下面仍給出兩種方式得到選擇的項的展現字符串：

1.options:

var options = this.config.gzclgcs.getOptions();//得到selectField的options
var value = this.config.gzclgcs.getValue();//得到當前選中項的值(默認爲value)
var len = options.length;
for (var i = 0; i < len; i++) {
    if (options[i].newValue == value) {
        return options[i].newText;
    }
}

2.store:

var value = this.config.gzclgcs.getValue();
var store = this.config.gzclgcs.getStore();
var len = store.getCount();
for(var i=0;i<len;i++) {
    if(store.getAt(i).get('newValue') == value) {
        return store.getAt(i).get('newText');
    }
}

關於setOptions()方法，其實在Sencha Touch  的內部仍是生成了一個store。因此即使是用setOptions的方法設置數據的也能夠經過第二種方式得到指定value獲得對應的fieldValue