整个过程主要就是：一开始进入页面是，在页面加载完成之后直接通过$(function(){ LoadRegisterUserInfo(1,10,0,0);//加载注册用户信息 });无条件加载数据，调用的方法可以查看下面的js代码。接着就是按条件查询数据，主要把条件查询的方式（searchWay）和查询的条件（condition）提交处理接受返回数据。（新手代码，性能方面估计没想太多，如有不足之处，敬请提出，本着学习交流的态度）
①Html代码（UserManager.cshtml）,展示分页数据
1 <div> 2 <div> 3 <h4><span style="padding-bottom:100px;">【快速搜索】</span></h4> 4 5 <span style="margin-top:10px;"> 6 <span id="UserManagerSearchSpan"> 7 <input type="button" value="查看所有用户" style="background-color:#33FFCC;border-style:solid;border-width:1px;border-radius:6px;" onclick="LoadRegisterUserInfo(1,10,0,0)" /> 8 角色：<select id="search_role"> 9 @if (Session["AdminLevel"].ToString() == "0") 10 { 11 <option value="1">学生</option> 12 <option value="2">教师</option> 13 <option value="3">管理员</option>} 14 else 15 { 16 <option value="1">学生</option><option value="2">教师</option> } 17 </select> 18 <span><input type="button" value="按角色查询" onclick="LoadRegisterUserInfo(1,10,1,1)" /> </span><span> 19 20 登录账号：<input type="text" id="search_accountNumber" data-toggle="tooltip" data-placement="top" title="<h5> <span class='myTipTitleColor'>请填写有效的账号！</span></h5>"/> 21 </span><span><input type="button" value="按账号查询" onclick="LoadRegisterUserInfo(1, 10, 2, 0)" /> </span><span> 22 23 姓名：<input type="text" id="search_name" data-toggle="tooltip" data-placement="top" title="<h5> <span class='myTipTitleColor'>请填写用户的姓名！</span></h5>" /> 24 </span><span><input type="button" value="按姓名查询" onclick="LoadRegisterUserInfo(1, 10, 3, 0)" /> </span> 25 </span> 26 </span> 27 </div> 28 <hr /> 29 <div id="UserManageTablePlace"> 30 <table id="RegisterUserInfoTable"> 31 <tr class="mytr3"><th>编号</th><th>登录账号</th><th>姓名</th><th>性别</th><th>证件号码</th><th>用户类型</th><th>操作</th></tr> 32 </table> 33 <table id="UserStateTable" style="display:none"> 34 <tr class="mytr3"><th>编号</th><th>登录账号</th><th>姓名</th><th>性别</th><th>证件号码</th><th>用户类型</th><th>操作</th></tr> 35 </table> 36 </div> 37 <br /> 38 <div class="myPage"> 39 <span class="myShowPage"> 40 <!--这里放页码导航--> 41 </span> 42 43 </div> 44 <br /> 45 </div>
②C#代码，主要回去返回需要展示的数据（AdminController.cs）
1 /* 2 * 这里除了一次性第一次无条件查询之外，还可以处理根据不同条件去查询 3 * 4 * searchWay（0--无条件查询，即系查询所有，1--按角色查询，2--按账号查询，3---按名字查询） 5 * condition（0---无条件查询.。如果按角色查询（1---按学生角色查询，2---按教师角色查询，3--按管理员角色查询）。如果是按账号查询，则此时的condition就是需要查询的账号。如果为按名字查询，则此时的condition就是需要查询的名字） 6 * 7 */ 8 //②加载【所有待验证的注册用户】的信息 9 List<AllUserInfo> AllList = AllUserInfo.GetAllRegisterUserInfo(Session["AdminLevel"].ToString()); 10 List<AllUserInfo> AllList2 = new List<AllUserInfo>();//放筛选之后的数据 11 int pageSize = Request["pageSize"] == null ? 10 : int.Parse(Request["pageSize"]); 12 int pageIndex = Request["pageIndex"] == null ? 1 : int.Parse(Request["pageIndex"]); 13 14 //判断是否是条件筛选 15 string searchWay = Request["searchWay"]; 16 string condtition = Request["condition"]; 17 if (!string.IsNullOrEmpty(searchWay) && !string.IsNullOrEmpty(condtition))//条件筛选 18 { 19 int k1 = 1;//记录序号 20 if (searchWay == "0" && condtition == "0")//都是0的代表是无条件查询 21 { 22 AllList2 = AllList;//无条件查询 23 } 24 else if (searchWay == "1")//按角色去筛选 25 { 26 #region 筛选数据 27 string selectCondition; 28 29 if (condtition == "1")//【学生】 30 { 31 selectCondition = "学生"; 32 } 33 else if (condtition == "2")//【教师】 34 { 35 selectCondition = "教师"; 36 } 37 else if (condtition == "3")//【管理员】 38 { 39 selectCondition = "管理员"; 40 } 41 else 42 { 43 return Content("没找到相关数据！"); 44 } 45 46 //遍历，筛选数据 47 foreach (AllUserInfo use in AllList) 48 { 49 if (use.Role == selectCondition) 50 { 51 use.ListID = k1; 52 AllList2.Add(use); 53 k1++; 54 } 55 } 56 #endregion 57 58 } 59 else if (searchWay == "2" && !string.IsNullOrEmpty(Request["selectCondition"].ToString()))//按账号查询 60 { 61 62 #region 遍历，筛选数据 63 string selectCondition = Request["selectCondition"]; 64 foreach (AllUserInfo use in AllList) 65 { 66 if (use.UserNum == selectCondition) 67 { 68 use.ListID = k1; 69 AllList2.Add(use); 70 k1++; 71 } 72 } 73 #endregion 74 } 75 else if (searchWay == "3" && !string.IsNullOrEmpty(Request["selectCondition"].ToString()))//按名字进行查找 76 { 77 #region 遍历，筛选数据 78 string selectCondition = Request["selectCondition"]; 79 foreach (AllUserInfo use in AllList) 80 { 81 if (use.UserName == selectCondition) 82 { 83 use.ListID = k1; 84 AllList2.Add(use); 85 k1++; 86 } 87 } 88 #endregion 89 } 90 else 91 { 92 return Content("没找到相关数据！"); 93 } 94 } 95 else 96 { 97 //searchWay = " "; 98 //condtition = " "; 99 //AllList2 = AllList; 100 } 101 102 int total = AllList2.Count;//获取筛选之后的全部数据总的个数 103 ViewData["pageSize"] = pageSize;//每一页显示的条数 104 ViewData["pageIndex"] = pageIndex;//当前需要显示的页码 105 ViewData["total"] = total; 106 107 List<AllUserInfo> RetList = new List<AllUserInfo>();//这个列表放需要显示页的数据 108 for (int i = pageSize * (pageIndex - 1); i < pageSize * (pageIndex - 1) + pageSize; i++)//根据页码和页的大小截取数据记录，然后放在RetList中 109 { 110 if (i == AllList2.Count)//如果到达列表结尾，直接跳出 111 { 112 break; 113 } 114 RetList.Add(AllList2[i]); 115 116 } 117 118 var json = new//格式化返回数据，转换成json 119 { 120 Total = RetList.Count,//返回数据的条数 121 Row = RetList.ToList(),//返回数据集合 122 PageNumber = Page.ShowPageNavigate(pageIndex,pageSize,total,searchWay,condtition)//这个方法为分页导航条的字符串 123 }; 124 125 126 return Json(json, JsonRequestBehavior.AllowGet);//返回数据
③分页导航处理生产字符串的方法（Page.cs）
1 public class Page 2 { 3 public static string ShowPageNavigate( int currentPage, int pageSize, int totalCount,string searchWay, string condition) 4 { 5 pageSize = pageSize == 0 ? 3 : pageSize; 6 var totalPages = Math.Max((totalCount + pageSize - 1) / pageSize, 1); //总页数 7 var output = new StringBuilder(); 8 if (totalPages > 1) 9 { 10 //if (currentPage != 1) 11 {//处理首页连接 12 output.AppendFormat("<a class='pageLink' href='javascript:void(0);' οnclick='LoadRegisterUserInfo({0},{1},{2},{3})'>首页</a> ", 1, pageSize,searchWay, condition); 13 } 14 if (currentPage > 1) 15 {//处理上一页的连接 16 17 output.AppendFormat("<a class='pageLink' href='javascript:void(0);' οnclick='LoadRegisterUserInfo({0},{1},{2},{3})'>上一页</a> ", currentPage - 1, pageSize,searchWay, condition); 18 } 19 else 20 { 21 // output.Append("<span class='pageLink'>上一页</span>"); 22 } 23 24 output.Append(" "); 25 int currint = 5; 26 for (int i = 0; i <= 10; i++) 27 {//一共最多显示10个页码，前面5个，后面5个 28 if ((currentPage + i - currint) >= 1 && (currentPage + i - currint) <= totalPages) 29 { 30 if (currint == i) 31 {//当前页处理 32 //{0}?pageIndex={1}&pageSize={2} 33 output.AppendFormat("<a href='javascript:void(0);'><span class='currentPage'>{0}</span></a> ", currentPage); 34 //output.AppendFormat("<a class='active' href='javascript:void(0);'>{0}</a> ", currentPage); 35 } 36 else 37 {//一般页处理 38 39 output.AppendFormat("<a class='pageLink' href='javascript:void(0);' οnclick='LoadRegisterUserInfo({0},{1},{2},{3})'>{4}</a> ", currentPage + i - currint, pageSize,searchWay, condition, currentPage + i - currint); 40 } 41 } 42 output.Append(" "); 43 } 44 if (currentPage < totalPages) 45 {//处理下一页的链接 46 47 output.AppendFormat("<a class='pageLink' href='javascript:void(0);' οnclick='LoadRegisterUserInfo({0},{1},{2},{3})'>下一页</a> ", currentPage + 1, pageSize,searchWay,condition); 48 } 49 else 50 { 51 //output.Append("<span class='pageLink'>下一页</span>"); 52 } 53 output.Append(" "); 54 if (currentPage != totalPages) 55 { 56 57 output.AppendFormat("<a class='pageLink' href='javascript:void(0);' οnclick='LoadRegisterUserInfo({0},{1},{2},{3})'>末页</a> ", totalPages, pageSize,searchWay,condition); 58 } 59 output.Append(" "); 60 } 61 output.AppendFormat("第{0}页 / 共{1}页", currentPage, totalPages);//这个统计加不加都行 62 63 return output.ToString(); 64 } 65 }
④Js处前端和后端的交互（adminJS2.js）
1 $(function () { 2 $('[data-toggle="tooltip"]').tooltip({ html: true }); 3 LoadRegisterUserInfo(1,10,0,0);//加载注册用户信息 4 }); 5 6 //SaveSearchWay = ""; 7 //SaveCondition = ""; 8 9 /// <summary> 10 /// 加载注册【用户信息】 11 /// </summary> 12 /// <param name="pageIndex">页号</param> 13 /// <param name="pageSize">显示条数</param> 14 /// <param name="searchWay">搜索方式</param> 15 /// <param name="condition">条件</param> 16 /// <returns></returns> 17 function LoadRegisterUserInfo(pageIndex, pageSize,searchWay,condition) { 18 //alert(searchWay + "____" + condition); 19 //alert(pageIndex + "_______" + pageSize); 20 //【条件筛选】初始化数据 21 var selectCondition = 0; 22 if (searchWay == "1") {//【按照角色查找】 23 condition = $("#search_role").val(); 24 } 25 if (searchWay == "2") {//【按账号查找】 26 if ($("#search_accountNumber").val() != "") { 27 condition = 0; 28 selectCondition = $("#search_accountNumber").val(); 29 } 30 else { 31 alert("请填写需要查询的账号！"); 32 return; 33 } 34 } 35 if (searchWay == "3") {//【按照姓名查找】 36 if ($("#search_name").val() != "") { 37 condition = 0; 38 selectCondition = $("#search_name").val(); 39 } else { 40 alert("请填写需要查询的姓名！"); 41 return; 42 } 43 } 44 45 46 //①先清空原来的表格 47 $("#RegisterUserInfoTable tr:gt(0)").remove(); 48 49 var k = 0; 50 //②发生请求 51 $.post("/Admin/GetAllRegisterUserInfo", { "pageIndex": pageIndex, "pageSize": pageSize, "searchWay": searchWay, "condition": condition ,"selectCondition":selectCondition}, function (data) { 52 //alert(result["Grade1"]); 53 //alert("Total" + data["Total"]); 54 55 if (data["Total"] <= 0) { 56 $("#RegisterUserInfoTable").append("<tr class=' mytr2-1' align = 'left'><td colspan = '7'>暂无学生信息</td> </tr>"); 57 } 58 //var str = "<a href=javascript:void(0); οnclick=SaveScoreBtnClick('" + stuNum + "','" + courseNum + "')>保存</a>"; 59 //alert(searchWay + "____" + condition); 60 61 for (var i = 0; i < data["Total"]; i++) { 62 63 //拼接删除链接字符串 64 var str1 = "<a href=javascript:void(0); οnclick=DeleteRegisterUser('" + data['Row'][i].UserNum + "','" + data['Row'][i].Role + "'," + data["Row"][i].ListID + ")>删除</a>" 65 66 //拼接通过连接字符串 67 var str2 = "<a href=javascript:void(0); οnclick=PassRegisterUser('" + data['Row'][i].UserNum + "','" + data['Row'][i].Role + "'," + data["Row"][i].ListID + ")>通过</a>" 68 69 if (k == 0) {//处理隔行不同样式展示 70 $("#RegisterUserInfoTable").append("<tr class='mytr2 mytr2-1' id= "+data["Row"][i].ListID+"><td>" + data["Row"][i].ListID + "</td><td>" + data["Row"][i].UserNum + "</td><td>" + data["Row"][i].UserName + "</td><td>" + data["Row"][i].Sex + "</td><td>" + data["Row"][i].IdentityCard + "</td><td>" + data["Row"][i].Role + "</td><td>"+str1+" | "+str2+"</td></tr>"); 71 k = 1; 72 } 73 else { 74 $("#RegisterUserInfoTable").append("<tr class=' mytr2-1' id=" + data["Row"][i].ListID + "><td>" + data["Row"][i].ListID + "</td><td>" + data["Row"][i].UserNum + "</td><td>" + data["Row"][i].UserName + "</td><td>" + data["Row"][i].Sex + "</td><td>" + data["Row"][i].IdentityCard + "</td><td>" + data["Row"][i].Role + "</td><td>" + str1 + " | " + str2 + "</td></tr>"); 75 k = 0; 76 } 77 } 78 79 $(".myShowPage").html(""); 80 $(".myShowPage").html(data["PageNumber"]);//填充处理数据 81 82 }); 83 84 }
148
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
