Ext.data.GroupingStore 从后台获取数据

1.看ExtJs3.3.1的examples，学习了一下，实现从后台获取数据，真的不喜欢，本地的数据，一定要实现了后台读取数据，才爽。。。。

前台js

    var xg = Ext.grid;
    //1.定义数据存储器store
    var store = new Ext.data.GroupingStore({
	    	autoLoad:true,
    		reader: new Ext.data.JsonReader({
    			root:'results',//与后台中的map的key相同，开始的时候写在了外面了，数据没有显示出来。
    			               //以前简写时是直接写的，用了JsonReader之后要加载{},里面，后面就是以前的fields(而fields,也可以写成Ext.data.record.cr                                       //eate([{}]),这样的形式)
    			}, [
    		         {name: 'company'},
    		         {name: 'price', type: 'float'},
    		         {name: 'change', type: 'float'},
    		         {name: 'pctChange', type: 'float'},
    		         {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'},
    		         {name: 'industry'},
    		         {name: 'desc'}
    		]),
            //data: xg.dummyData2,//本地数据直接是对象数组。
    		proxy : new Ext.data.HttpProxy({
    		     url : 'getGroupDatas.json',
    		     method: 'GET'
    		}),
            sortInfo:{field: 'company', direction: "ASC"},
            groupField:'industry'//指定列分组
        });

    var grid = new xg.GridPanel({
        store: store,
        columns: [
            {id:'company',header: "Company", width: 60, sortable: true, dataIndex: 'company'},
            {header: "Price", width: 20, sortable: true, renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
            {header: "Change", width: 20, sortable: true, dataIndex: 'change', renderer: Ext.util.Format.usMoney},
            {header: "Industry", width: 20, sortable: true, dataIndex: 'industry'},
            {header: "Last Updated", width: 20, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
        ],
        view: new Ext.grid.GroupingView({
            forceFit:true,
            //下面这个属性会对每一组进行统计总数。
            groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
        }),
        frame:true,
        width: 700,
        height: 450,
        collapsible: true,
        animCollapse: false,
        title: 'Grouping Example',
        iconCls: 'icon-grid',
        fbar  : ['->', {
            text:'Clear Grouping',
            iconCls: 'icon-clear-group',
            handler : function(){
                store.clearGrouping();//去除分组，好像没见添加分组的函数。
            }
        }],
        renderTo: document.body
    });

后台获取数据，用的是servlet,

	if("/getGroupDatas".equals(path)){
			//company,price,change,pctChange,lastChange,industry
			List<Map<String,Object>> list = new ArrayList<Map<String,Object>>();
			for(int i=0;i<10;i++){
				Map<String,Object> map = new HashMap<String,Object>();
				map.put("company", "IBM("+i+")");
				map.put("price",10.1+i);
				map.put("change", 0.05+i);
				map.put("pctChange", Float.parseFloat("0.4"+i));
				map.put("lastChange", "4/3 12:00am");
				if(i < 3){
					map.put("industry", "Manufacturing");
				}else if(i <6 ){
					map.put("industry", "Food");
				}else {
					map.put("industry", "Computer");
				}
				list.add(map);
			}
			Map<String,Object> maps = new HashMap<String,Object>();
			maps.put("results", list);
			JSONObject obj= JSONObject.fromObject(maps);
			out.println(obj.toString());}