DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> ExtJS 下拉多選框lovcombo
ExtJS 下拉多選框lovcombo
編輯:關於JavaScript     
開始以為很簡單,在option裡加個input checkbox就行了。哪知行不通,網上搜了一些實現方法,主要是用div層來模擬下拉。本想照著這種思路,再結合這個項目具體應用自己寫一個,發現太麻煩了。剛好在另外一個項目中使用extjs,找到了一個擴展lovcombo,學習了一下它自帶的例子(配合2.3版的extjs,3.x版的貌似有問題)。例子倒不難,關鍵是要把它添加到現有的代碼中,並且盡量少的改動原有代碼。

下拉多選框的使用過程中處理比較多的邏輯主要集中在數據源store的配置和select事件的處理。extjs本身的那種數據和UI分離的模式使得級聯的實現非常輕松。只需在省份下拉框的select事件中去更新城市下拉框的store即可。一個需要注意的小地方是:一個選項被select時,需要額外的通過checkField的值來判斷該選項是被選中還是被取消。還有就是全選、取消全選(這兩個lovcombo自帶有方法selectAll和deselectAll)以及被選中選項數目(需要遍歷一遍store,並檢測每一項的checkField值)。

復制代碼 代碼如下:
//下拉框的select事件
select:function(combo, record, index)
{
//選中
if(record.get(this.checkField))
{
//選中時的處理邏輯
}
else
{
//未選中
}
}
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved