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;

     }

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