EXTJS系列笔记————grid新增和修改数据与后台的快速交互

1、拿取grid的store

var store = obj.up("form").nextSibling("gridpanel").getStore();

2、拿取新增记录和修改记录

var addRecords = store.getNewRecords();

var updateRecords = store.getUpdateRecords();

3、将记录变成数组形式

var addRecordArr=new Array();

//新添加的数据

for(var i=0;i<addRecords.length;i++){

    ddRecordArr.push(addRecords[i].getData());

}

var updateRecordArr=new Array();

//修改的数据

for(var i=0;i<updateRecords.length;i++){

    updateRecordArr.push(updateRecords[i].getData());

}

4、将数组转化为json字符串

var newJsonStr=Ext.encode(addRecordArr);

var updateJsonStr=Ext.encode(updateRecordArr);

5、然后将上述字符ajax请求发送到后台

Ext.Ajax.request({

    url:"test/test.do",

    params:{

    newJsonStr:newJsonStr,

    updateJsonStr:updateJsonStr

    },

    method:"post",
dataType:"text",
success:function(data){
alert(data.responseText);
store.load();
}

});

6、后台接收json字符串以后，将其转换为List.

List<ProBasePage> newList = GsonUtil.parseJsonArrayWithGson(newJsonStr, ProBasePage.class);

7、GsonUtil的代码

   // 将Json数据解析成相应的映射对象

     public static <T> T parseJsonWithGson(String jsonData, Class<T> type) {

         Gson gson = new Gson();

         T result = gson.fromJson(jsonData, type);

         return result;

     }

 

     // 将Json数组解析成相应的映射对象列表

     public static <T> List<T> parseJsonArrayWithGson(String json,

             Class<T> clazz) {

    Type type = new TypeToken<ArrayList<JsonObject>>(){}.getType();

        ArrayList<JsonObject> jsonObjects = new Gson().fromJson(json, type);

        ArrayList<T> arrayList = new ArrayList<T>();

        for (JsonObject jsonObject : jsonObjects)

        {

            arrayList.add(new Gson().fromJson(jsonObject, clazz));

        }

        return arrayList;

     }

以上就是简单的前后台数据交互，个人人为这种方式挺简单的，同时区分了新增数据和修改数据。如果有更好的方法，请留言赐教。