easyui combobox分組

實例：$('#txt_style').combobox({
        valueField: "id",
        textField: "text",
        data: [{
            "group": "水果", "id": 'a1',
            "text": '西瓜'
        }, { "group": "水果", "id": 'a2',
            "text": '菠蘿'
        }, { "group": "蔬菜",
            "id": 'b1',
            "text": '大白菜'
        }, { "group": "蔬菜",
            "id": 'b2',
            "text": '小白菜'
        }, {
            "id": '豬肉',
            "text": '豬肉'
        }], groupField: "group"})

 運行效果：

如下是easyUI combobox api：

擴展自 $.fn.combo.defaults。 用 $.fn.combobox.defaults 重寫了 defaults。

 

 

依賴

• combo

用法

1. <select id="cc" name="dept" style="width:200px;">

2. <option value="aa">aitem1</option>

3. <option>bitem2</option>

4. <option>bitem3</option>

5. <option>ditem4</option>

6. <option>eitem5</option>

7. </select>

 

1. <input id="cc" name="dept" value="aa">

 

1. $('#cc').combobox({  

2.     url:'combobox_data.json',  

3.     valueField:'id',  

4.     textField:'text'

5. }); 

json 數據格式的示例

1. [{  

2. "id":1,  

3. "text":"text1"

4. },{  

5. "id":2,  

6. "text":"text2"

7. },{  

8. "id":3,  

9. "text":"text3",  

10. "selected":true

11. },{  

12. "id":4,  

13. "text":"text4"

14. },{  

15. "id":5,  

16. "text":"text5"

17. }] 

特性

其特性擴展自 combo，下列是爲combobox 增長的特性。

名稱	類型	說明	默認值
valueField	string	綁定到 ComboBox 的 value 上的基礎數據的名稱。	value
textField	string	綁定到 ComboBox 的 text 上的基礎數據的名稱。	text
mode	string	定義在文本改變時如何加載列表數據。若是組合框從服務器加載就設爲 'remote' 。	local
url	string	從遠程加載列表數據的 URL 。	null
method	string	用來檢索數據的 http method 。	post
data	array	被加載的列表數據。	null
filter	function	定義當 'mode' 設爲 'local' 時如何過濾數據。這個函數有兩個參數： q：用戶輸入的文字 row：列表中的行數據。 返回 true 就容許顯示該行。
formatter	function	定義如何呈現行。這個函數有一個參數：row。

事件

其事件擴展自 combo，下列是爲 combobox 增長的事件。

名稱	參數	說明
onLoadSuccess	none	當遠程數據加載成功時觸發。
onLoadError	none	當遠程數據加載失敗時觸發。
onSelect	record	當用戶選擇一個列表項時觸發。
onUnselect	record	當用戶取消選擇一個列表項時觸發。

方法

其方法擴展自 combo，下列是爲 combobox 追加或重寫的方法。

名稱	參數	說明
options	none	返回 options 對象。
getData	none	返回加載的數據。
loadData	data	加載本地列表數據。
reload	url	請求遠程的列表數據。
setValues	values	把數組設置爲組合框的值。
setValue	value	設置組合框的值。
clear	none	清除組合框的值。
select	value	選擇指定的選項。
unselect	value	取消選擇指定的選項。

 轉載自：http://www.cnblogs.com/hantianwei/archive/2012/03/19/2407081.html