Ext Js簡單Grid創建使用及AJAX處理

在使用Ext Js對於Grid組件使用必不可少的，對於它的掌握也是需要的。簡單貼一些代碼，看看Grid的創建使用，就不細講每一步了，代碼注釋還可以，不明白的可以在評論中寫一下，或發郵件給我，一定幫助解答，歡迎交流。
1.簡單Ext Js Grid的創建使用(創建Ext.grid.GridPanel需要store(proxy\reader)\colModel)

//創建GridPanel對象
function createGrid() {
    //創建表格的列信息
    var cm1 = new Ext.grid.ColumnModel([
            { header: '編號', dataIndex: 'id', width: 80, sortable: true }, //sortable:是否排序,width:重設列寬
            {header: '名稱', dataIndex: 'name', sortable: true },
            { header: '描述', dataIndex: 'desn', id: 'desn' }
    //實現自動擴展列的效果，設置對應的列的id賦值，autoExpandColum
        ]);

    //添加數據信息
    var data = [
            ['1', 'name1', 'desn1'],
            ['2', 'name2', 'desn2'],
            ['3', 'name3', 'desn3'],
            ['4', 'name4', 'desn4'],
            ['5', 'name5', 'desn5']
        ];

    var dataObj = Ext.data.Record.create([//創建Record對象結構
            {name: "id" },
            { name: "name" },
            { name: "desn" }
        ]);
    //創建數據存儲對象
    var ds = new Ext.data.Store({
        proxy: new Ext.data.MemoryProxy(data),
        reader: new Ext.data.ArrayReader({},
            [//此處的結構還可以使用上文對象，dataObj
                {name: 'id' },
                { name: 'name' },
                { name: 'desn' }
            ]
            )
    });
    ds.load(); //這個非常必要，load為自動傳入數據；loadData手動傳入數據

    //表格列模型定義好了，原始數據和數據轉換完成，再裝配到一起，Grid就創建成功了
    var grid = new Ext.grid.GridPanel({
        renderTo: "divGrid", //rendTo屬性指示將表格渲染到什么地方
        width: 500, height: 500,
        store: ds, //數據
        colModel: cm1, //列顯示
        stripeRows: true, //斑馬線效果
        loadMask: true, //讀取數據遮罩和提示,Loading....
        enableColumnMove: false, //取消列的拖放
        enableColumnResize: true, //取消列的大小改變
        viewConfig: {
            forceFit: true//自動填滿Grid,填滿父容器"grid"的大小，
        }
    });
}

2.簡單封裝一些Grid的創建，添加對於時間數據的顯示控制

function testGrid() {
    var myColModel = new Ext.grid.ColumnModel([//列模式
             new Ext.grid.RowNumberer(), //行號
            {header: "ID", dataIndex: "id", sortable: true },
            { header: "Name", dataIndex: "name", sortable: true },
            { header: "Description", dataIndex: "desn", sortable: true },
            { header: "DateTime", dataIndex: "lastDate", type: "date",
                renderer: Ext.util.Format.dateRenderer("Y年m月d日 H時m分s秒")
            }//添加一列日期,設置日期格式
        ]);

    var data = [//數據
            ["001", "張三", "學生", '2009-09-12T09:09:09'],
            ['002', '李四', '工作', '2009-09-20T09:09:09'],
            ['003', '王五', '教師', '2010-10-10T09:09:09'],
            ['004', '李白', '詩人', '2011-10-01T09:09:09'],
            ['005', 'QQ', '娛樂', '2012-09-09T09:09:09']
        ];

    var dataRecord = Ext.data.Record.create([//創建Record對象
            {name: "id" },
            { name: "name" },
            { name: "desn" },
            { name: "lastDate", type: "date", dateFormat: "Y-m-dTH:m:s"}//設定日期讀取格式
        ]);

    var myStore = new Ext.data.Store({//創建Store對象
        proxy: new Ext.data.MemoryProxy(data), //創建指定代理
        reader: new Ext.data.ArrayReader({}, dataRecord)//創建指定數組讀取器
    });
    myStore.load(); //加載數據

    var grid = new Ext.grid.GridPanel({
        renderTo: Ext.getBody(), width: 400, height: 500,
        style: "margin-left: 100px; margin-top: 100px",
        store: myStore,
        colModel: myColModel,
        loadMask: true,
        stripeRows: true,
        enableColumnMove: true,
        enableColumnResize: true,
        viewConfig: {
            forceFit: false//如果強制填充,將不會有滾動條顯示
        }
    });
    //行和列自動根據Grid的大小和數據的顯示滾動條
    grid.setAutoScroll(true);
}

//本地數據創建GridPanel
function createGridPanel() {
    var grid = new Ext.grid.GridPanel({
        width: 600, height: 300, frame: true, iconCls: "icon-grid", title: "GridTest",
        stripRow: true, loadMask: true, enableColumnMove: true, enableColumnResize: true,
        sm: createSelModel(),
        store: createStore(),
        colModel: createColumns(),
        renderTo: Ext.getBody(),
        viewConfig: { forceFit: true}//自動填充
    });
}
//創建GridColumns
function createColumns() {
    var cols = new Ext.grid.ColumnModel({
        defaults: { width: 100, sortable: true },
        columns: [
                { id: "company", header: "Company", dataIndex: "company", width: 120, sortable: true },
                { header: "Price", dataIndex: "price", renderer: Ext.util.Format.usMoney },
                { header: "Change", dataIndex: "change" },
                { header: "LastUpdate", dataIndex: "lastDate", type: "date", renderer: Ext.util.Format.dateRenderer("Y年m月d日") }
                ]
    });
    return cols;
}
//創建數據存儲Store
function createStore() {
    //符合格式的數據
    var myData = [
            ["company1", 1, "change1", "2009-09-17"],
            ["company2", 2, "change2", "2012-10-10"],
            ["company3", 3, "change3", "2010-06-10"],
            ["company4", 4, "change4", "2012-07-10"],
            ["company5", 5, "change5", "2010-05-10"],
            ["company6", 6, "change6", "2012-11-10"]
            ];
    //創建Reader，按指定格式讀取
    var myReader = Ext.data.Record.create([
            { name: "company" },
            { name: "price" },
            { name: "change" },
            { name: "lastDate", type: "date", dateFormat: "Y-m-d"}//注意時間轉換
            ]);
    //創建數據集對象Store
    var store = new Ext.data.Store({
        proxy: new Ext.data.MemoryProxy(myData),
        reader: new Ext.data.ArrayReader({}, myReader)
    });
    store.load(); //load為自動傳入數據；loadData手動傳入數據
    return store;
}

//創建選中模式
function createSelModel() {
    var selModel = new Ext.grid.RowSelectionModel({
        singleSelect: true
    });
    return selModel;
}

3.簡單可編輯Grid的AJAX操作：加載、添加、修改、刪除數據
前台ExtJs的創建EditorGridPanel，以及加載、添加、修改、刪除操作：

Ext.onReady(function () {
    gridAjaxTest();
});

function gridAjaxTest() {
    var checkSelModel = new Ext.grid.CheckboxSelectionModel({ checkOnly: true }); //單行選中{ singleSelect: true },checkBox顯示
    var cm = new Ext.grid.ColumnModel([//設置列的結構
            checkSelModel,
            { header: '學生ID', dataIndex: 'StuID', width: 80 },
            { header: '學生姓名', dataIndex: 'StuName', editor: new Ext.grid.GridEditor(new Ext.form.TextField({})) },
            { header: '學生年齡', dataIndex: 'StuAge', editor: new Ext.grid.GridEditor(new Ext.form.TextField({ allowBlank: false })) },
            { header: '學生性別', dataIndex: 'StuSex', editor: new Ext.grid.GridEditor(new Ext.form.ComboBox({ store: ['男', '女'], triggerAction: 'all', editable: false, autoSelect: true })) },
            { header: '學生描述', dataIndex: 'StuDesp', id: 'StuDesp', editor: new Ext.grid.GridEditor(new Ext.form.TextArea({ allowBlank: false })) },
            { header: '入學日期', dataIndex: 'StuDate', width: 150, editor: new Ext.grid.GridEditor(new Ext.form.DateField({ editable: false, format: 'Y-m-d', value: new Date().format('Y-m-d') })) }
            ]);

    var ds = new Ext.data.JsonStore({//設置數據綁定
        url: 'TestGridAjax.ashx', //請求地址
        baseParams: { Option: 'GetData' },
        fields: ['StuID', 'StuName', 'StuAge', 'StuSex', 'StuDesp', 'StuDate']//綁定字段
    });
    ds.load();

    var gridAjax = new Ext.grid.EditorGridPanel({//可編輯GridPanel
        width: 800, height: 500, renderTo: Ext.getBody(),
        style: { marginLeft: 100, marginTop: 100 },
        store: ds, //數據
        colModel: cm, //列顯示結構
        //sm:checkSelModel,//checkBox顯示選中
        sm: new Ext.grid.RowSelectionModel(), //單行選中{ singleSelect: true },不設為多行選中
        loadMask: true, stripeRows: true, autoExpandColumn: 'StuDesp', //設置一列自動填充剩余部分
        clicksToEdit: 2, //雙擊觸發修改
        tbar: new Ext.Toolbar([
                { text: '添加', handler: function () { addData(gridAjax); } }, '-', //添加操作
                {text: '刪除', id: 'btnDelete', handler: function () {//刪除操作
                    Ext.MessageBox.confirm('信息提示', '你確定要刪除嗎？', function (btn) { if (btn == 'yes') { delData(gridAjax); } });
                }
            }, '-',
                { text: '保存', id: 'tbnSave', handler: function () { saveData(gridAjax); } }//保存操作
                ])
    });
}

function addData(gridAjax) {//添加操作,傳入GridPanel對象
    var stu = new Ext.data.Record({ StuID: 0, StuName: '學生名', StuAge: 20, StuSex: '', StuDesp: '', StuDate: '' }); //添加默認數據
    gridAjax.stopEditing();
    gridAjax.store.insert(0, stu); //在第0行插入該記錄
    gridAjax.startEditing(0, 1);
}

function delData(gridAjax) {//刪除數據(實現單行\多行記錄刪除)
    if (gridAjax.selModel.getCount() > 0) {//獲取選中的行總數
        //var record = gridAjax.selModel.getSelected(); //獲取選中的單條記錄
        var records = gridAjax.selModel.getSelections(); //獲取選中的所有記錄
        var stuIDS = ""; //要刪除學生ID集合
        for (var i = 0; i < records.length; i++) {
            stuIDS += records[i].data.StuID + ",";
        }
        if (stuIDS.indexOf(',')) { stuIDS = stuIDS.substring(0, stuIDS.lastIndexOf(',')); } //去掉最后一個","

        Ext.Ajax.request({
            method: 'POST', //請求方式大小寫敏感
            url: 'TestGridAjax.ashx',
            params: { Option: 'DeleteData', JsonData: stuIDS },
            success: function (response, options) {//執行成功
                gridAjax.store.remove(records); //數據庫刪除成功,前台刪除選中的所有記錄
                gridAjax.reconfigure(gridAjax.store, gridAjax.colModel); //綁定對象並刷新
                Ext.MessageBox.alert('信息提示', Ext.util.JSON.decode(response.responseText).Msg); //獲取后台返回的Json數據Msg鍵的值
            },
            failure: function (response, options) { Ext.MessageBox.alert('信息提示', Ext.util.JSON.decode(response.responseText).Msg); }
        });
    }
    else {
        Ext.MessageBox.alert('信息提示', '請選擇你要刪除的數據！');
    }
}

function saveData(gridAjax) {//保存數據
    var records = null; //清空數據組數據
    var jsonData = ""; //清空Json格式數據
    records = gridAjax.store.getModifiedRecords(); //獲取所有修改的記錄(添加\修改的記錄)
    if (records.length <= 0)
    { return; }
    jsonData = '['; //Json數據
    for (var i = 0; i < records.length; i++) {//遍歷集合,將所有修改的拼接成Json數據
        jsonData += String.format("{'StuID':{0},'StuName':'{1}','StuAge':{2},'StuSex':'{3}','StuDesp':'{4}','StuDate':'{5}'},",
                                            records[i].data.StuID, records[i].data.StuName, records[i].data.StuAge, records[i].data.StuSex, records[i].data.StuDesp,
                                            records[i].data.StuDate == '' ? new Date().format('Y-m-d') : records[i].data.StuDate.format('Y-m-d')); //如果為空轉換為當前時間
    }
    if (jsonData.indexOf(',')) { jsonData = jsonData.substr(0, jsonData.lastIndexOf(',')); } //去除最后一個","
    jsonData += "]";

    Ext.Ajax.request({
        method: 'POST', //請求方式大小寫敏感
        url: 'TestGridAjax.ashx',
        params: { Option: 'SaveData', jsonData: jsonData },
        success: function (response, opts) { var json = Ext.util.JSON.decode(response.responseText); Ext.MessageBox.alert('信息提示', json.Msg) }, //獲取返回的Json數據
        failure: function (response, opts) { Ext.MessageBox.alert('信息提示', Ext.util.JSON.decode(response.responseText)); }
    });
    gridAjax.store.reload();
}

后台對於AJAX的響應操作創建一般處理程序.ashx文件，對於加載、增、刪、改數據的響應，使用List集合模擬數據操作，對於List集合轉化為Json和Json轉化為List集合,即Json的序列化和反序列化操作：
(注意對於命名空間的引入以及JavaScriptSerializer和DataContractJsonSerializer兩個序列化器的差異，可參見：小心DataContractJsonSerializer和JavaScriptSerializer的內部實現差異)

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.Serialization.Json;
using System.Text;
using System.Web;
using System.Web.Script.Serialization;

namespace WebExtJS.WebTest
{
    /// <summary>
    /// TestGridAjax1 的摘要說明
    /// </summary>
    public class TestGridAjax1 : IHttpHandler
    {
        private List<Student> listStus = null;//(或全局靜態變量)學生數據集合

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            listStus = GetDataSet();//初始化數據,假的模擬數據

            string strOption = context.Request["Option"] != null ? context.Request["Option"].Trim().ToString() : null;
            string jsonData = context.Request["JsonData"] != null ? context.Request["JsonData"].Trim().ToString() : string.Empty;
            string outPutMsg = string.Empty;
            switch (strOption)
            {
                case "GetData": outPutMsg = JavaScriptSerialize(listStus); break;//獲取數據
                case "SaveData": outPutMsg = SaveData(jsonData); break;//保存數據
                case "DeleteData": outPutMsg = DeleteData(jsonData); break;//刪除數據
                case "SaveSingle": outPutMsg = SaveSingle(context.Request); break;//保存單條記錄
                case "GetPagingData": outPutMsg = GetPagingData(context.Request); break;//分頁查詢處理
                default: break;
            }

            context.Response.Write(outPutMsg);//將處理后的Json數據傳出
            context.Response.End();
        }

        /// <summary>
        /// JS序列化，將對象轉換為Json數據
        /// 注意：JS對於List對象的,處理需要對傳出的Json數據,進行簡單字符替換
        /// </summary>
        /// <param name="listStus">List集合</param>
        /// <returns>序列化的數據</returns>
        private string JavaScriptSerialize(List<Student> listStus)
        {
            string json = string.Empty;
            if (listStus != null && listStus.Count > 0)
            {
                JavaScriptSerializer jsSerializer = new JavaScriptSerializer();
                json += jsSerializer.Serialize(listStus).Replace("\"", "'");//字符處理
            }

            //json = json.Insert(0, "{'TotalCount':'" + listStus.Count + "',rows:");//這是數據保存統一的輸出格式需要的
            //json = json.Insert(json.Length, "}");

            return json;
        }
        /// <summary>
        /// JS反序列化操作
        /// 注意：根據前面設計的數據格式,可以直接反序列化
        /// </summary>
        /// <param name="json">前台格式的數據</param>
        /// <returns>List集合</returns>
        private List<Student> JavaScriptDeserialize(string json)
        {
            List<Student> tempStus = new List<Student>();
            if (!string.IsNullOrEmpty(json))
            {
                JavaScriptSerializer jsDeserializer = new JavaScriptSerializer();
                tempStus = jsDeserializer.Deserialize<List<Student>>(json);
            }
            return tempStus;
        }

        /// <summary>
        /// Json序列化,將對象轉化為Json數據
        /// 注意：對於C#處理的Json可以直接使用
        /// </summary>
        /// <param name="listStus"></param>
        /// <returns></returns>
        private string JsonSerialize(List<Student> listStus)
        {
            string json = string.Empty;
            if (listStus != null && listStus.Count > 0)
            {
                DataContractJsonSerializer jsonSerializer = new DataContractJsonSerializer(typeof(List<Student>));
                MemoryStream ms = new MemoryStream();
                jsonSerializer.WriteObject(ms, listStus);
                json += Encoding.UTF8.GetString(ms.ToArray());
                ms.Close();
            }
            return json;
        }
        /// <summary>
        /// Json反序列化操作
        /// 注意：根據前面提供的數據需要小小的字符串處理
        /// </summary>
        /// <param name="json"></param>
        /// <returns></returns>
        private List<Student> JsonDeserialize(string json)
        {

            List<Student> tempStus = new List<Student>();
            if (!string.IsNullOrEmpty(json))
            {
                json = json.Replace("'", "\"");//字符串處理
                DataContractJsonSerializer jsonDeserializer = new DataContractJsonSerializer(typeof(List<Student>));
                MemoryStream ms = new MemoryStream(Encoding.UTF8.GetBytes(json));
                tempStus = (List<Student>)jsonDeserializer.ReadObject(ms);
            }
            return tempStus;
        }

        /// <summary>
        /// 根據前台傳入的Json數據,保存數據
        /// </summary>
        /// <param name="jsonData"></param>
        /// <returns>是否成功的Json數據</returns>
        private string SaveData(string jsonData)
        {
            string message = "{'Msg':'保存失敗！'}";
            List<Student> tempStudents = new List<Student>();

            if (!string.IsNullOrEmpty(jsonData))
            {
                //tempStudents = JavaScriptDeserialize(jsonData);//JS反序列化
                tempStudents = JsonDeserialize(jsonData);//C#反序列化

                int rows = AddAndUpdateStus(tempStudents);//添加修改操作
                if (rows > 0)
                {
                    message = "{'Msg':'傳出Json數據,保存成功!'}";//向前台輸出Json數據
                }
                else
                {
                    message = "{'Msg':'傳出Json數據,保存失敗！'}";
                }
            }
            return message;
        }

        /// <summary>
        /// 單條數據的保存操作
        /// </summary>
        /// <param name="request"></param>
        /// <returns></returns>
        private string SaveSingle(HttpRequest request)
        {
            string message = "{success:false,Msg:'保存失敗！'}";
            try
            {//表單提交,HttpRequest獲取所有的對象
                string stuID = request["StuID"].ToString() == "" ? "0" : request["StuID"].ToString();
                string stuName = request["StuName"].ToString();
                int stuAge = int.Parse(request["StuAge"].ToString());
                string stuSex = request["StuSex"].ToString();
                string stuDesp = request["StuDesp"].ToString();
                string stuDate = request["StuDate"].ToString();

                Student stu = new Student() { StuID = stuID, StuAge = stuAge, StuName = stuName, StuSex = stuSex, StuDesp = stuDesp, StuDate = stuDate };
                AddAndUpdateStus(stu);
                message = "{success:true,Msg:'保存成功！'}";
            }
            catch (Exception exp)
            {
                throw new Exception("異常信息");
            }
            return message;
        }

        /// <summary>
        /// 根據傳入的學生ID集合刪除數據,可以單條\多條記錄刪除,這里執行數據庫刪除
        /// </summary>
        /// <param name="jsonData"></param>
        /// <returns></returns>
        private string DeleteData(string jsonData)
        {
            string message = "{'Msg':'刪除失敗！'}";
            if (!string.IsNullOrWhiteSpace(jsonData))
            {
                List<Student> tempLambStus = listStus.FindAll(student => jsonData.Contains(student.StuID));//Lambda查詢獲取數據
                List<Student> tempLinqStus = new List<Student>((from student in listStus where jsonData.Contains(student.StuID) select student).ToList());//Linq查詢獲取數據轉化為List集合

                listStus.RemoveAll(student => jsonData.Contains(student.StuID));//刪除符合條件的記錄
                message = "{'Msg':'刪除成功！'}";
            }
            return message;
        }

        /// <summary>
        /// 添加\修改操作,這里執行數據庫的增\改
        /// </summary>
        /// <param name="stus"></param>
        /// <returns></returns>
        private int AddAndUpdateStus(List<Student> stus)
        {
            int rows = 0;
            if (stus.Count > 0)
            {
                try
                {
                    foreach (Student stu in stus)//遍歷所有集合
                    {
                        AddAndUpdateStus(stu);//對於單條數據的處理
                    }
                    rows = stus.Count;//返回影響行數
                }
                catch (Exception exp)
                {
                    rows = -1;
                }
            }
            return rows;
        }

        /// <summary>
        /// 對於單條記錄的處理,這里執行單條記錄的增\改
        /// </summary>
        /// <param name="stu"></param>
        private void AddAndUpdateStus(Student stu)
        {
            if (stu.StuID == "0")//ID為0表示新加記錄
            {
                listStus.Add(stu);
            }
            else
            {//根據ID獲取對象,修改數據
                Student oldStu = listStus.Find(student => student.StuID == stu.StuID);//查找該對象是否存在
                //var oldStudent = from student in listStus where student.StuID == stu.StuID select student;//獲取符合ID的對象
                //var stuIDS = from student in listStus where student.StuID == stu.StuID select student.StuID;//獲取所有的ID集合
                oldStu.StuAge = stu.StuAge;
                oldStu.StuDate = stu.StuDate;
                oldStu.StuDesp = stu.StuDesp;
                oldStu.StuName = stu.StuName;
                oldStu.StuSex = stu.StuSex;
            }
        }

        /// <summary>
        /// 對於數據的分頁處理
        /// </summary>
        /// <param name="request"></param>
        /// <returns></returns>
        private string GetPagingData(HttpRequest request)//這里執行數據庫分頁操作
        {
            string json = string.Empty;
            int start = request["start"] != null ? int.Parse(request["start"]) : 0;//開始記錄數
            int limit = request["limit"] != null ? int.Parse(request["limit"]) : 2;//頁大小

            var stus = (from student in listStus orderby student.StuID select student).Skip(start).Take(limit);//Linq分頁查詢
            List<Student> tempLinqStus = new List<Student>(stus.ToList());//轉化為List集合

            List<Student> tempLambStus = listStus.OrderBy(student => student.StuID).Skip(start).Take(limit).ToList();//Lambda分頁查詢

            //字符拼接,指定總記錄數(totalProperty)和顯示數據的根(root)
            json = JavaScriptSerialize(tempLinqStus).Insert(0, "{'TotalCount':'" + listStus.Count + "',Datas:");
            json = json.Insert(json.Length, "}");

            //json = JsonSerialize(tempLinqStus).Insert(0, "{\"TotalCount\":\"" + listStus.Count + "\",Datas:");
            //json = json.Insert(json.Length, "}");

            return json;
        }

        /// <summary>
        /// 初始化數據,這里執行數據庫查詢初始化操作
        /// </summary>
        /// <returns></returns>
        private List<Student> GetDataSet()
        {
            List<Student> listStus = new List<Student> { //初始化數據
            new Student(){ StuID="1", StuAge=20, StuName="李白", StuSex="男", StuDesp="學生1", StuDate=DateTime.Now.ToString()},
            new Student(){ StuID="2", StuAge=21, StuName="李明",StuSex="男",StuDesp="學生2",StuDate=DateTime.Now.AddDays(1).ToString() },
            new Student(){StuID="3",StuAge=18,StuName="李麗",StuSex="女",StuDesp="學生3",StuDate=DateTime.Now.AddDays(2).ToString()},
            new Student(){StuID="4",StuAge=27,StuName="韓梅",StuSex="女",StuDesp="學生4",StuDate=DateTime.Now.AddDays(-2).ToString()},
            new Student(){StuID="5",StuAge=20,StuName="李磊",StuSex="男",StuDesp="學生5",StuDate=DateTime.Now.AddDays(-1).ToString()}
            };
            return listStus;
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }

        #region Json序列化和反序列化操作
        /// <summary>
        /// Json序列化
        /// </summary>
        /// <typeparam name="T"></typeparam>
        /// <param name="t"></param>
        /// <returns></returns>
        private string JsonSerialize<T>(T t)
        {
            DataContractJsonSerializer jsonSerializer = new DataContractJsonSerializer(typeof(T));
            MemoryStream ms = new MemoryStream();
            jsonSerializer.WriteObject(ms, t);
            string json = Encoding.UTF8.GetString(ms.ToArray());
            ms.Close();
            return json;
        }
        /// <summary>
        /// Json反序列化
        /// </summary>
        /// <typeparam name="T"></typeparam>
        /// <param name="jsonString"></param>
        /// <returns></returns>
        private T JsonDeserialize<T>(string jsonString)
        {
            DataContractJsonSerializer jsonDeserializer = new DataContractJsonSerializer(typeof(T));
            MemoryStream ms = new MemoryStream(Encoding.UTF8.GetBytes(jsonString));
            T obj = (T)jsonDeserializer.ReadObject(ms);
            return obj;
        }
        #endregion
    }

    /// <summary>
    /// 學生類
    /// </summary>
    public class Student
    {
        public string StuID;
        public string StuName;
        public int StuAge;
        public string StuSex;
        public string StuDesp;
        public string StuDate;
    }
}

 這個一般處理程序文件也包括對於Grid的分頁處理的AJAX調用處理，下篇隨筆將分享對於Grid如何進行數據分頁的處理。