前台界面：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>DataGrid教程</title> <script src="Scripts/jquery.min.js" type="text/javascript"></script> <script src="Scripts/easyui-lang-zh_CN.js" type="text/javascript"></script> <script src="Scripts/jquery.easyui.min.js" type="text/javascript"></script> <link rel="Stylesheet" type="text/css" href="Styles/themes/icon.css" /> <link rel="Stylesheet" type="text/css" href="Styles/themes/default/easyui.css" /> <script type="text/javascript"> $(document).ready( function () { $("#QuestionList").datagrid( { title: "问卷列表", url: "Handler.ashx", columns: [[ { field: "Id", title: "编号", "100" }, { field: "Title", title: "题目", "200" }, { field: "Remark", title: "备注", "200" } ]], rownumbers: true, //行号 singleSelect: false, //是否单选 pagination: true//分页控件 } ); var p = $('#QuestionList').datagrid('getPager'); $(p).pagination({ pageSize: 10, //每页显示的记录条数，默认为10 pageList: [10, 20, 50], //可以设置每页记录条数的列表 beforePageText: '第', //页数文本框前显示的汉字 afterPageText: '页 共 {pages} 页', displayMsg: '当前显示 {from} - {to} 条记录 共 {total} 条记录' }); //下面是针对easyui-dialog $("#QuestionInfo").dialog( { title: "问卷信息", '900', height: '600', iconCls: 'icon-edit', // href: 'QueationInfo.htm', modal: true, closed: true, buttons: [{ text: '保存', iconCls: 'icon-ok', handler: function () { $("#QInfo").form('submit', { url: url, onSubmit: function () { return $(this).form('validate'); }, success: function (result) { var result = eval('(' + result + ')'); if (result.errorMsg) { $.messager.show({ title: '错误信息', msg: result.errorMsg }); } else { $('#QuestionInfo').dialog('close'); $('#QuestionList').datagrid('reload'); } } }); } }, { text: '取消', iconCls: 'icon-cancel', handler: function () { $('#QuestionInfo').dialog('close'); } }] } ); } ); function Add() { $("#QuestionInfo").dialog("open"); url = 'Add.ashx?type=add'; } function edit() { var row = $('#QuestionList').datagrid('getSelected'); if (row) { $('#QuestionInfo').dialog('open').dialog('setTitle', '编辑'); $('#QInfo').form('load', row); url = 'Add.ashx?type=edit'; } else { alert('请选择行'); } } function Del() { $.messager.confirm('确认', '你确认要删除该记录吗？', function (r) { if (r) { var row = $('#QuestionList').datagrid('getSelected'); if (row) { url = 'Add.ashx?type=del&&Id=' + row.Id; // alert(url); // $.ajax({ // contentType: "application/json", // type: "post", // dataType: "json", // url: 'Add.ashx', // data: "{'type':'del','Id':" + row.Id + "}", // sucess: function (msg) { // alert('dd'); // } // }); $.post('Add.ashx?type=del', { Id: row.Id }, function (result) { if (result.status == 1) { $('#QuestionList').datagrid('reload'); } else { $.messager.alert('错误', result.msg, 'error'); } }, 'json' ); } else { alert('请选择行'); } } }); } </script> </head> <body> <div id="toolbar"> <a href="#" class="easyui-linkbutton" iconcls="icon-add" plain="true" onclick="Add()"> 添加</a> <a href="#" class="easyui-linkbutton" iconcls="icon-edit" plain="true" onclick="edit()"> 编辑</a> <a href="#" class="easyui-linkbutton" iconcls="icon-remove" plain="true" onclick="Del()"> 删除</a> </div> <table id="QuestionList"> </table> <div id="QuestionInfo"> <form id="QInfo" method="post"> <input type="hidden" name="Id" /> <p> 标题：<input id="Title" name="Title" /></p> <p> <!-- form取值针对的是name--> 备注：<input id="Remark" name="Remark" /></p> </form> </div> </body> </html>
处理页：
1.得到List列表
public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; string result = ""; string Title = context.Request["page"]; string a = Title; if (a == "1") { IList<QuestionModel> Infos = new QuestionBLL().GetModelList(" id<10 "); result = JsonConvert.SerializeObject(Infos); } else { IList<QuestionModel> Infos = new QuestionBLL().GetModelList("id>9 and id<100 "); result = JsonConvert.SerializeObject(Infos); } //总记录数total //构造json result = "{"total":100,"rows":"+result+"}"; context.Response.Write(result); }
2.增加修改删除
using System; using System.Collections.Generic; using System.Linq; using System.Web; using Wzh.BLL; using Wzh.Model; using System.Text; namespace Web { /// <summary> /// Add 的摘要说明 /// </summary> public class Add : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; string type = context.Request["type"]; StringBuilder result = new StringBuilder(); if (type == "add") { int AddId = add(context); ; if (AddId == 0) { result.Append("{"errorMsg":"添加失败"}"); } else { result.Append("{"errorMsg":false}"); } } else if(type=="edit") { int EditId = Edit(context); ; if (EditId == 0) { result.Append("{"errorMsg":"编辑失败"}"); } else { result.Append("{"errorMsg":false}"); } } else if (type == "del") { if (!Del(Convert.ToInt32(context.Request["Id"]))) { result.Append("{"sucess":"删除失败"}"); } else { result.Append("{"success":true,"status":1}"); } } context.Response.Write(result.ToString()); } public int add(HttpContext context) { string Title = context.Request["Title"]; string Remark = context.Request["Remark"]; QuestionModel Model = new QuestionModel(); Model.Remark = Remark; Model.Title = Title; return new QuestionBLL().Add(Model); } public int Edit(HttpContext context) { int Id = 0; Id = Convert.ToInt32(context.Request["Id"]); string Title = context.Request["Title"]; string Remark = context.Request["Remark"]; QuestionModel Model = new QuestionModel(); Model.Remark = Remark; Model.Title = Title; Model.Id = Id; new QuestionBLL().Update(Model); return Id; } public bool Del(int Id) { return new QuestionBLL().Delete(Id); } public bool IsReusable { get { return false; } } } }