Ext 向Ext.form.ComboBox()中添加列表的分类

1、静态

[javascript]  view plain copy

1. var staticComboBox = new Ext.form.ComboBox({  
2.  fieldLabel:'回访结果',  
3.  name:'result',  
4.  hiddenName:'result',  
5.  anchor:'100%',  
6.  editable:false,  
7.  readOnly:true,  
8.  mode:'local',  
9.  triggerAction:'all',  
10.  store:new Ext.data.SimpleStore({  
11.   fields:['code','desc'],   
12.   data:[  
13.      ['全部','全部'],  
14.      ['回访成功','回访成功'],  
15.      ['无人','无人'],  
16.      ['错号','错号'],  
17.      ['停机','停机']  
18.   ],  
19.   autoLoad:true  
20.  }),  
21.  value:'全部',  
22.  valueField:'code',  
23.  displayField:'desc'  
24. });  

 

2、动态:

 

[javascript]  view plain copy

1. //前台     
2. var dynamicComboBox = new Ext.form.ComboBox({     
3.     fieldLabel:'回访人员',     
4.     hiddenName:'operator',     
5.     name: 'operator',     
6.     mode: 'remote',     
7.     triggerAction:'all',     
8.     anchor:'100%',     
9.     editable : false,     
10.     readOnly:true,     
11.     store:     
12.         new Ext.data.Store({     
13.             proxy:new Ext.data.HttpProxy({     
14.                 url:'TestAction!loadOperator.action'    
15.             }),     
16.             reader:new Ext.data.JsonReader({     
17.                 root: 'root',     
18.                 totalProperty: 'totalProperty',     
19.                 fields:['code','desc']     
20.             }     
21.         ),     
22.         autoLoad:true    
23.     }),     
24.     valueField: 'code',   //值字段     
25.     displayField: 'desc', //显示字段      
26.     value:'全部'    
27. });     
28. //后台参见：http://blog.csdn.net/xieshengjun2009/archive/2010/10/22/5959687.aspx   

 

3、动态取值后 - 前台另添加一条记录:

[javascript]  view plain copy

1. var record = Ext.data.Record.create([  
2.         {name:'code',type:'string',mapping:'0'},  
3.         {name:'desc',type:'string',mapping:'1'}  
4. ]);  
5.   
6. var newRecord = new record({code:'全部',desc:'全部'});  
7.   
8. var store = new Ext.data.Store({  
9.     proxy:new Ext.data.HttpProxy({url:'TestAction!loadGroupName.action'}),  
10.     reader:new Ext.data.JsonReader({  
11.         totalProperty:'results',  
12.         root:'rows',  
13.         fields:[  
14.             {name:'code'},  
15.             {name:'desc'}  
16.         ]  
17.     }),  
18.     autoLoad:true,  
19.     listeners:{'load':function(){  
20.             store.add(newRecord);  
21.         }  
22.     }  
23. });  
24.   
25. var groupNameComboBox = new Ext.form.ComboBox({  
26.     name:'groupName',  
27.     width:130,  
28.     readOnly:true,  
29.     emptyText:'请选择',  
30.     valueField:'code',      //逻辑列名的实际值(code)  
31.     displayField:'desc',    //逻辑列名的显示值(decs)  
32.     triggerAction:'all',  
33.     editable : false,  
34.         width:140,  
35.         anchor:'100%',  
36.         store:store  

 

4、动态取值后 - 后台另添加一条记录:

     前台：

[javascript]  view plain copy

1. var dynamicComboBox = new Ext.form.ComboBox({  
2.     fieldLabel:'回访人员',  
3.     hiddenName:'operator',  
4.     name: 'operator',  
5.     mode: 'remote',  
6.     triggerAction:'all',  
7.     anchor:'100%',  
8.     editable : false,  
9.     readOnly:true,  
10.     store:  
11.         new Ext.data.Store({  
12.             proxy:new Ext.data.HttpProxy({  
13.                 url:'TestAction!loadOperator.action'  
14.             }),  
15.             reader:new Ext.data.JsonReader({  
16.                 root: 'root',  
17.                 totalProperty: 'totalProperty',  
18.                 fields:['code','desc']  
19.             }  
20.         ),  
21.         autoLoad:true  
22.     }),  
23.     valueField: 'code',   //值字段  
24.     displayField: 'desc', //显示字段   
25.     value:'全部'  
26. });  

后台：

[java]  view plain copy

1. Opterator optr = new Opterator();//返回的列表对象(自定义)  
2.   
3. List<Opterator> list = testService.loadtOpterator(map);  
4.   
5. Iterator<Opterator> it = list.iterator();  
6. int i=0;  
7.   
8. //将list列表数据封装成json格式的数据  
9. JSONObject jsonObject = new JSONObject();  
10.   
11. JSONArray jsonArray = new JSONArray();  
12. JSONObject jsonAll = new JSONObject();  
13.   
14. jsonAll.put("code", "全部");  
15. jsonAll.put("desc", "全部");  
16.   
17. jsonArray.put(i++, jsonAll);  
18.   
19. while(it.hasNext()){  
20.     JSONObject jsonObj = new JSONObject();  
21.     optr = (Opterator)it.next();  
22.     jsonObj.put("code", sr.getOptr());  
23.     jsonObj.put("desc", sr.getOptr());  
24.     jsonArray.put(i++, jsonObj);  
25. }  
26.   
27. jsonObject.put("totalProperty", list.size());  
28. jsonObject.put("root", jsonArray);  
29.   
30. // 输出到前台  
31. outJsonString(jsonObject.toString());  

第五种：直接在store的回掉函数里调用：

store.load({
	        	     callback: function(records, operation, success) {	        	     
	        	     	store.insert(store.getCount()+1,[{'code':0,'desc':'全部'}])	        	     	
	        	     },
	        	     scope: this
	        	     });