jquery -ajax-datagrid DataGrid序列化

来源：互联网发布：网络大电影设备编辑：程序博客网时间：2024/05/29 12:20

项目中用到的datagrid的例子，记录下来方便以后查看。

页面

<head runat="server"><script type="text/javascript">function ShowSearchResult(jfid, devid,insid, start, end, alarmValue) {            var width = document.body.clientWidth;            $('#divTest').datagrid({                url: 'AjaxJFHandler.ashx?stype=AalarmSearch&insid=' + insid,                queryParams: { 'start': start, 'end': end, alarmValue: alarmValue, "jfid": jfid,"devid":devid }, //当请求远程数据时，发送的额外参数。                loadMsg: '数据加载中请稍后……',                fitColumns: true, //自适应列宽，不出现横向滚动条                striped: true, //奇偶行不同背景                //method: //请求远程数据的method类型，默认post                // nowrap: true, //True 就会把数据显示在一行里,默认true                //pagination://True 就会在 datagrid 的底部显示分页栏。 默认false                singleSelect: true, //只能选中一行，默认false                fitColumns: true,                //    pagination: true, //显示分页栏                columns: [[                    { field: 'devname', title: "设备", align: 'center' },                    { field: 'insname', title: '变量', align: 'center' },                    { field: 'adatetime', title: '时间', align: 'center' },                    { field: 'avalue', title: '值', align: 'center' },                    { field: 'atype', title: '类型', align: 'center' }                ]],                onLoadSuccess: function (data) {                    var panel = $(this).datagrid('getPanel');                    var td = panel.find('div.datagrid-header-inner tr td');                    td.each(function (i, item) {                        switch (item.attributes.field.value) {                            case "adatetime":                                item.width = width / 4;                                break;                            case "avalue":                                item.width = width / 8;                                break;                            case "atype":                                item.width = width / 8;                                break;                            default:                                break;                        }                    });                }            });        }</script></head><body></body>

注：1. 参数传递方式有2种：即放在URL的后面，或者通过queryParams 属性。前者在后台获取参数值时，可以通过《context.Request.QueryString["参数名"]》或者《context.Request.Params["参数名"]》两种方法取得，后者（通过queryParams传参），只能通过第2种方式取得。

2. onLoadSuccess方法，在返回结果时但数据还未在页面上显示时执行，用于对返回的结果进行操作。此处，设置表头单元格的宽度。

AjaxJFHandler.ashx 页

public class AjaxJFHandler : IHttpHandler    {        public string Stype;         class ChartData        {            public string id;            public string data;        }        public void ProcessRequest(HttpContext context)        {            context.Response.ContentType = "text/xml";// "text/plain";            Stype = context.Request.QueryString["stype"];            string jfid = context.Request.QueryString["jfid"];            string code = context.Request.QueryString["code"];//站点代码            string devid = context.Request.Params["devid"];            string insid = context.Request.Params["insid"];//context.Request.QueryString["insid"];            string start = context.Request.Params["start"];            string end = context.Request.Params["end"];            string jfName = HttpUtility.UrlDecode(context.Request["jfName"]);            DataTable dt = new DataTable();            switch (Stype)            {                               case "AalarmSearch"://报警查询                    string alarmType=context.Request.Params["alarmValue"];                    dt = GetAlarmDataHisList(jfid,devid,insid, start, end, alarmType);                    context.Response.Write(SerializeDataGrid(dt));                    break;                             default:                    break;            }                             }        public bool IsReusable        {            get            {                return false;            }        }              private DataTable  GetAlarmDataHisList(string jfid,string devid,string insid,string start,string end,string atype)        {            JFData ddd = new JFData();            DataTable dt = ddd.GetAlarmDataHisList(jfid,devid,insid, start, end,atype);            //  string ss = Serialize(dt, false);            //  return ss;            return dt;        }                          /// <summary>序列化方法          /// 不需要分页          /// </summary>          /// <param name="dt"></param>          /// <param name="flag">false</param>          /// <returns></returns>         private string Serialize(DataTable dt, bool flag)        {            JavaScriptSerializer serializer = new JavaScriptSerializer();            List<Dictionary<string, object>> list = new List<Dictionary<string, object>>();            foreach (DataRow dr in dt.Rows)            {                Dictionary<string, object> result = new Dictionary<string, object>();                foreach (DataColumn dc in dt.Columns)                {                    result.Add(dc.ColumnName, dr[dc].ToString());                }                list.Add(result);                            }            string jsonStr= serializer.Serialize(list);            return jsonStr;        }        private string SerializeDataGrid(DataTable dt)//用JS的dataGrid拼table        {            JavaScriptSerializer serializer = new JavaScriptSerializer();            List<Dictionary<string, object>> list = new List<Dictionary<string, object>>();            Dictionary<string, object> ww = new Dictionary<string, object>();            ww.Add("total", dt.Rows.Count);            foreach (DataRow dr in dt.Rows)            {                Dictionary<string, object> result = new Dictionary<string, object>();                foreach (DataColumn dc in dt.Columns)                {                    result.Add(dc.ColumnName, dr[dc].ToString());                }                list.Add(result);            }            ww.Add("rows", list);            string jsonStr = serializer.Serialize(ww);            return jsonStr;        }    }

注：1. SerializeDataGrid 方法用于对datagrid类型的查询结果进行序列化。

2. Serialize 方法用于对一般的table查询结果进行序列化。

0 0