bootstrap-table-editable 小结
先贴一个json类 using System; using System.Collections.Generic; using System.Web; using System.Web.Script.Serialization; using System.Data; namespace PH.Common { /// <summary> /// JSON帮助类 /// </summary> public class JSONHelper { /// <summary> /// 对象转JSON /// </summary> /// <param name="obj">对象</param> /// <returns>JSON格式的字符串</returns> public static string ObjectToJSON(object obj) { JavaScriptSerializer jss = new JavaScriptSerializer(); try { return jss.Serialize(obj); } catch (Exception ex) { throw new Exception("JSONHelper.ObjectToJSON(): " + ex.Message); } } /// <summary> /// 数据表转键值对集合 /// 把DataTable转成 List集合,存每一行 /// 集合中放的是键值对字典,存每一列 /// </summary> /// <param name="dt">数据表</param> /// <returns>哈希表数组</returns> public static List<Dictionary<string,object>> DataTableToList(DataTable dt) { List<Dictionary<string,object>> list = new List<Dictionary<string,object>>(); foreach (DataRow dr in dt.Rows) { Dictionary<string,object> dic = new Dictionary<string,object>(); foreach (DataColumn dc in dt.Columns) { dic.Add(dc.ColumnName,dr[dc.ColumnName]); } list.Add(dic); } return list; } /// <summary> /// 数据集转键值对数组字典 /// </summary> /// <param name="dataSet">数据集</param> /// <returns>键值对数组字典</returns> public static Dictionary<string,List<Dictionary<string,object>>> DataSetToDic(DataSet ds) { Dictionary<string,object>>> result = new Dictionary<string,object>>>(); foreach (DataTable dt in ds.Tables) result.Add(dt.TableName,DataTableToList(dt)); return result; } /// <summary> /// 数据表转JSON /// </summary> /// <param name="dataTable">数据表</param> /// <returns>JSON字符串</returns> public static string DataTableToJSON(DataTable dt) { return ObjectToJSON(DataTableToList(dt)); } /// <summary> /// JSON文本转对象,泛型方法 /// </summary> /// <typeparam name="T">类型</typeparam> /// <param name="jsonText">JSON文本</param> /// <returns>指定类型的对象</returns> public static T JSONToObject<T>(string jsonText) { JavaScriptSerializer jss = new JavaScriptSerializer(); try { return jss.Deserialize<T>(jsonText); } catch (Exception ex) { throw new Exception("JSONHelper.JSONToObject(): " + ex.Message); } } /// <summary> /// 将JSON文本转换为数据表数据 /// </summary> /// <param name="jsonText">JSON文本</param> /// <returns>数据表字典</returns> public static Dictionary<string,object>>> TablesDataFromJSON(string jsonText) { return JSONToObject<Dictionary<string,object>>>>(jsonText); } /// <summary> /// 将JSON文本转换成数据行 /// </summary> /// <param name="jsonText">JSON文本</param> /// <returns>数据行的字典</returns> public static Dictionary<string,object> DataRowFromJSON(string jsonText) { return JSONToObject<Dictionary<string,object>>(jsonText); } } } 后台webservice 实现规则就是先执行操作再返回操作后的object ,当然要用json处理下。 修改就是返回修改后的object ?删除就是返回一个Id相同其它项是null的object 1、显示 public void GetResourceList() { List<PH.Model.Resource> list = new PH.BLL.Resource().GetModelList("1=1"); string strJson = PH.Common.JSONHelper.ObjectToJSON(list); Context.Response.Write(strJson); Context.Response.End(); } 2、修改 public void ModifyResourceList() { HttpRequest request = HttpContext.Current.Request; PH.BLL.Resource pbr = new PH.BLL.Resource(); PH.Model.Resource pmr = pbr.GetModel(int.Parse(request["Id"])); pmr.Content = request["Content"]; pmr.Length = request["Length"]; pmr.Link = request["Link"]; pmr.Name = request["Name"]; pmr.Title = request["Title"]; pmr.Type = request["Type"]; pmr.UnitId = request["UnitId"]; pbr.Update(pmr); string strJson = PH.Common.JSONHelper.ObjectToJSON(pmr); Context.Response.Write(strJson); Context.Response.End(); } 3、删除 public void RemoveResourceList() { HttpRequest request = HttpContext.Current.Request; PH.BLL.Resource pbr = new PH.BLL.Resource(); pbr.Delete(int.Parse(request["Id"])); PH.Model.Resource pmr = new PH.Model.Resource(); pmr.Id = int.Parse(request["Id"]); string strJson = PH.Common.JSONHelper.ObjectToJSON(pmr); Context.Response.Write(strJson); Context.Response.End(); } 前端 导入css 和 js清单 ? <link href="css/bootstrap.min.css" rel="stylesheet"> ? <script type="text/javascript" src="js/jquery.js"></script> 前端html <table id="table"> </table> 前端js <script type="text/javascript"> $(function () { $('#table').bootstrapTable({ url: 'Webservice.asmx/GetResourceList',method: 'post',contentType: 'application/x-www-form-urlencoded',toolbar: '#toolbar',striped: true,cache: false,pagination: true,sortName: 'Id',sortOrder: 'desc',sidePagination: 'client',pageNumber: 1,pageSize: 50,pageList: [10,25,50,100],strictSearch: true,clickToSelect: true,height: 600,uniqueId: 'Id',cardView: false,detailView: false,columns: [{ field: 'Id',title: '编号',sortable: true },{ field: 'UnitId',title: '单元编号',editable: { type: 'text',validate: function (value) { if ($.trim(value) == '') { return '单元编号不能为空!'; } } } },{ field: 'Name',title: '名称',validate: function (value) { if ($.trim(value) == '') { return '名称不能为空!'; } } } },{ field: 'Link',title: '链接',validate: function (value) { if ($.trim(value) == '') { return '链接不能为空!'; } } } },{ field: 'Type',title: '类型',validate: function (value) { if ($.trim(value) == '') { return '类型不能为空!'; } } } },{ field: 'Length',title: '大小',validate: function (value) { if ($.trim(value) == '') { return '大小不能为空!'; } } } },{ field: 'Title',title: '标题',validate: function (value) { if ($.trim(value) == '') { return '标题不能为空!'; } } } },{ field: 'Content',title: '内容',validate: function (value) { if ($.trim(value) == '') { return '内容不能为空!'; } } } },{ field: 'operation',title: '操作',width: 100,formatter: function (value,row,index) { var s = '<a class = "save" href="javascript:void(0)">保存</a>'; var d = '<a class = "remove" href="javascript:void(0)">删除</a>'; return s + ' ' + d; },events: 'operateEvents' }] }); window.operateEvents = { 'click .save': function (e,value,index) { $.ajax({ type: "post",data: row,url: 'Webservice.asmx/ModifyResourceList',success: function (data) { alert('修改成功'); } }); },'click .remove': function (e,url: 'Webservice.asmx/RemoveResourceList',success: function (data) { alert('删除成功'); $('#table').bootstrapTable('remove',{ field: 'Id',values: [row.Id] }); } }); } }; }); </script> 查询 ?js+ queryParams: function (params) { return { Id: $('#id').val(),pageSize: params.limit,offset: params.offset,sortOrder: params.order,UnitId: $('#unitid').val(),Name: $('#name').val()<strong>............................</strong> } },url: '<span style="font-family: Arial,Helvetica,sans-serif;">Webservice.asmx/QueryResourceList</span>' } 后台 ?还是用前面的方法取值 HttpRequest request = HttpContext.Current.Request; request["*****"] (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |