extjs 列表框(multiselect)的動態添加列表項的方法

2019-11-21 01:13:30

字體：大中小

來源：轉載

供稿：網友

因為它這個是創建時自動加載的ArrayStore(關鍵字是:data: ds),沒有動態增加的示例,但我們的項目需要有三個列表框,并且后兩個的內容要根據第一個列表框內容動態的加載,因此要在選擇第一個列表框的內容時,動態填充后兩個的內容.我比較佩服exjts的示例寫作人員,這些應該在示例中體現的功能，他們都沒有寫到,包括之前的2.2版本的示例,網上也沒有搜索到,害我找了一天如何動態控制列表數據的功能.首先說明一下，我的方法也不是官方的方法，只是自己靈機一動想到的,下面是動態增加列表項的方法.
在方法之前我的關于multiselect對象的store是這樣定義的:

復制代碼代碼如下:

flowDs = new Ext.data.ArrayStore({ 
data: [[123,123]], 
fields: ['value','text'] 
}); 

(1)var toflowStore = msForm.getForm().findField('toflow').store; //根據名稱得到multiselect對象的store對象;
(2)創建一個Ext.data.Record對象,這正在我想了好久的增加方法,也怪自己太笨了:

復制代碼代碼如下:

var record = new Object(); 
record.value = "2"; 
record.text = "3"; 
var records = new Ext.data.Record(record); 

(3) 將創建的Ext.data.Record對象加至multiselect的store對象中:
toflowStore.add(record1);
通過以上三步就可以為列表multisleect動態增加列表項了,提醒一下刪除某項可以通過remove()/removeAll()方法,具體的使用方法可以通過示例代碼的ItemSelector.js中查到.
通過以上分析后,大致可以簡單估計到multiselect的創建規則,在store中有一個屬性fields: ['value','text'],則在創建時,系統會通過循環的方式將屬性data:[[123,123]]中的內容創建為object對象,然后寫到時它的store對象中,類似下面的代碼:

復制代碼代碼如下:

var item = [],itemObj,record; 
for(var i = 0; i< this.data.length;i++){ 
item = this.data[i]; 
itemObj = new Object(); 
itemObj.value = item[0]; 
itemObj.text = item[1]; 
record = new Ext.data.Record(itemObj); 
this.store.add(record); 
} 

以上只是我腓臆的猜測，具體extjs的工程師是不是如此設計他們的程序，還沒有仔細研究.

上一篇：javascript getElementsByName()的用法說明

下一篇：JavaScript 學習小結(適合新手參考)