用户管理页面布局:
页面中间调用一个panel,然后在调用一个datagrid,datagrid有toolbar头部的工具栏,参考easyui API
1 @{ 2 Layout = null; 3 } 4 5 6 7 8 9 10用户信息管理 11 12 13 @**@14 15 16 17 18 19 20 21 26 27 28 29 30 31 65 66 67
用户管理页面大致有5个功能:页面加载用户信息的绑定,添加,删除,修改,刷新
1.加载用户信息:
返回用户的所有信息,将一个用户的信息当做是一个对象,然后返回一个集合,然后在返回一个Json的字符串。
前台的datagrid绑定:
1 $(function () {2 $('#dg').datagrid({3 url: '/Manage/Return_UserInfoAll'4 });5 })
Manage控制器中的Return_UserInfoAll的方法:(将集合返回成Json字符串)
1 ///2 /// 返回所有用户信息的方法 3 /// 4 ///5 public ActionResult Return_UserInfoAll() 6 { 7 // 8 List userInfoList = new UserInfoService().ReturnAllInfo(); 9 return Json(userInfoList, JsonRequestBehavior.AllowGet);10 }
BLL中的UserInfoService的ReturnAllInfo方法:
1 public ListReturnAllInfo()2 {3 return userInfoDal.ReturnAllInfo();4 }
Dal中的UserInfoDal的ReturnAllInfo()方法:(返回一个T_UserInfo的集合)
1 ///2 /// 获取所有用户信息 3 /// 4 ///5 public List ReturnAllInfo() 6 { 7 string sql = " select * from T_userInfo "; 8 9 DataTable dt = SqlHelper.SelectSqlReturnDataTable(sql, CommandType.Text);10 11 List userInfoList = null;12 if(dt.Rows.Count>0)13 {14 userInfoList = new List ();15 T_UserInfo userInfo = null;16 foreach(DataRow row in dt.Rows)17 {18 userInfo = new T_UserInfo();19 LoadEntity_DealPower(row, userInfo);20 userInfoList.Add(userInfo);21 }22 }23 return userInfoList;24 }25 26 /// 27 /// 处理所有信息包括权限28 /// 29 /// 30 /// 31 public void LoadEntity_DealPower(DataRow row, T_UserInfo userInfo)32 {33 userInfo.Id = Convert.ToInt32(row["id"].ToString());34 userInfo.UserName = row["userName"] != DBNull.Value ? row["userName"].ToString() : string.Empty;35 userInfo.UserPassword = row["userPassword"] != DBNull.Value ? row["userPassword"].ToString() : string.Empty;36 userInfo.UserEmail = row["userEmail"] != DBNull.Value ? row["userEmail"].ToString() : string.Empty;37 userInfo.User_BM = row["user_BM"] != DBNull.Value ? row["user_BM"].ToString() : string.Empty;38 userInfo.Add_time = Convert.ToDateTime(row["add_time"]);39 userInfo.User_FullName = row["user_FullName"] != DBNull.Value ? row["user_FullName"].ToString() : string.Empty;40 userInfo.User_Power = row["user_Power"] != DBNull.Value ? row["user_Power"].ToString() : string.Empty;41 42 //用户权限,1-用户权限,2-管理员权限,3-超级权限43 if(userInfo.User_Power =="1")44 {45 userInfo.User_Power = "普通用户权限";46 }47 else if(userInfo.User_Power =="2")48 {49 userInfo.User_Power = "管理员权限";50 }51 else if(userInfo.User_Power =="3")52 {53 userInfo.User_Power = "超级权限";54 }55 }
2.添加功能:
添加一个隐藏的div,用于easyui调用一个dialog
前台dialog div代码:
1 2
dialog中的部门下拉框的数据绑定:(跟页面加载的绑定用户信息的差不多)
js代码:
1 $('#dc').combobox({2 url: "/Manage/Return_BmAll",3 valueField: 'Bm_no',4 textField: 'Bm_mc'5 });
控制器的方法:(返回所有部门信息)
1 ///2 /// 部门展示3 /// 4 ///5 public ActionResult Return_BmAll()6 {7 List bmlist = new BmService().ReturnAll();8 return Json(bmlist, JsonRequestBehavior.AllowGet);9 }
BLL中的BmService中的方法:
1 public List<T_Bm> ReturnAll() 2 { 3 return bmdal.ReturnAll(); 4 }
Dal中的BmDal中的方法:
1 ///2 /// 返回所有部门的信息 3 /// 4 ///5 public List ReturnAll() 6 { 7 string sql = " select * from T_bm "; 8 9 DataTable dt = SqlHelper.SelectSqlReturnDataTable(sql, CommandType.Text);10 List bmlist = null;11 if(dt.Rows.Count>0)12 {13 bmlist = new List ();14 T_Bm bm = null;15 foreach(DataRow row in dt.Rows)16 {17 bm = new T_Bm();18 LoadEntity(row, bm);19 bmlist.Add(bm);20 }21 }22 return bmlist;23 }24 25 /// 26 /// 初始化27 /// 28 /// 29 /// 30 public void LoadEntity(DataRow row, T_Bm bm)31 {32 bm.Id = Convert.ToInt32(row["id"].ToString());33 bm.Bm_no = row["bm_no"] != DBNull.Value ? row["bm_no"].ToString() : string.Empty;34 bm.Bm_mc = row["bm_mc"] != DBNull.Value ? row["bm_mc"].ToString() : string.Empty;35 bm.Adder = row["adder"] != DBNull.Value ? row["adder"].ToString() : string.Empty;36 bm.Add_time = Convert.ToDateTime(row["add_time"].ToString());37 }
添加功能的js代码:(相关的字段验证,然后在发送ajax请求)
1 //add 2 $("#add").click(function () { 3 4 $('#dc').combobox({ 5 url: "/Manage/Return_BmAll", 6 valueField: 'Bm_no', 7 textField: 'Bm_mc' 8 }); 9 10 $("#dia_add").dialog({11 title: "添加用户",12 width: 600,13 height: 500,14 buttons: [{15 text: '添加',16 iconCls: 'icon-ok',17 18 handler: function () {19 //添加20 $.messager.confirm('确认', '您确认要添加吗?', function (r) {21 if (r) {22 //验证23 var obj_username = $("#username").textbox('getText');24 var obj_userpassword = $("#userpassword").textbox('getText');25 var obj_userpassword_confirm = $("#userpassword_comfirm").textbox('getText');26 var obj_email = $("#useremail").textbox('getText');27 var obj_department = $("#dc").combobox('getValue');28 var obj_fullname = $("#fullname").textbox('getText');29 30 if (obj_username == "" || obj_userpassword == "" || obj_userpassword_confirm == "" || obj_email == "" || obj_fullname=="") {31 $.messager.alert('提示', ' 请填写相关必填项!', 'warning');32 return;33 }34 if (obj_userpassword != obj_userpassword_confirm) {35 $.messager.alert('提示', ' 两次输入的密码必须一致!', 'warning');36 return;37 }38 if (obj_department == "") {39 $.messager.alert('提示', ' 部门不能为空!', 'warning');40 return;41 }42 //43 $.ajax({44 url: "/Manage/UserInfo_add",45 type: "post",46 data: {47 "username": $("#username").textbox('getText'),48 "userpassword": $("#userpassword_comfirm").textbox('getText'),49 "useremail": $("#useremail").textbox('getText'),50 "userbm": $("#dc").combobox('getValue'),51 "userfullname": $("#fullname").textbox('getText'),52 "userpower": $("#cc").combobox('getValue')53 },54 success: function (data) {55 if (data == "ok") {56 //57 $.messager.alert("提示", "添加成功!", "info", function () {58 //59 //$("#add_bmno").textbox("setText", "");60 $("#username").textbox("setText", "");61 $("#userpassword").textbox("setText", "");62 $("#userpassword_comfirm").textbox("setText", "");63 $("#useremail").textbox("setText", "");64 $("#fullname").textbox("setText", "");65 66 $('#dia_add').dialog('close');67 $('#dg').datagrid('reload');68 })69 }70 else {71 //72 $.messager.alert("提示", "添加异常,联系管理员!", "info");73 }74 }75 })76 77 }78 })79 }80 }, {81 text: '取消',82 iconCls: 'icon-no',83 handler: function () {84 //关闭之前要清空85 $("#username").textbox("setText", "");86 $("#userpassword").textbox("setText", "");87 $("#userpassword_comfirm").textbox("setText", "");88 $("#useremail").textbox("setText", "");89 $("#fullname").textbox("setText", "");90 91 $('#dia_add').dialog('close');92 }93 }],94 modal: true95 })96 })
添加功能,控制器中的方法:
1 ///2 /// 用户添加 3 /// 4 ///5 public ActionResult UserInfo_add() 6 { 7 T_UserInfo userinfo = new T_UserInfo(); 8 9 userinfo.UserName = Request["username"];10 userinfo.UserPassword = Request["userpassword"];11 userinfo.UserEmail = Request["useremail"];12 userinfo.User_BM = Request["userbm"];13 userinfo.User_FullName = Request["userfullname"];14 userinfo.User_Power = Request["userpower"];15 16 if(new UserInfoService().Insert_totab(userinfo)>0)17 {18 return Content("ok");19 }20 else21 {22 return Content("no");23 }24 }
添加功能,BLL中的 UserInfoService中的Insert_totab方法:
1 ///2 /// 添加用户详细信息3 /// 4 /// 5 ///6 public int Insert_totab(T_UserInfo userinfo)7 {8 return userInfoDal.Insert_totab(userinfo);9 }
添加功能,Dal中的 UserInfoDal中的Insert_totab方法:
1 ///2 /// 添加用户详细信息 3 /// 4 /// 5 ///6 public int Insert_totab(T_UserInfo userinfo) 7 { 8 string sql = " insert into T_userInfo (userName,userPassword,userEmail,user_BM,user_FullName,user_Power) values (@userName,@userPassword,@userEmail,@user_BM,@user_FullName,@user_Power) "; 9 SqlParameter[] pars ={10 new SqlParameter("@userName",SqlDbType.NVarChar,50),11 new SqlParameter("@userPassword",SqlDbType.NVarChar,50),12 new SqlParameter("@userEmail",SqlDbType.NVarChar,50),13 new SqlParameter("@user_BM",SqlDbType.NVarChar,50),14 new SqlParameter("@user_FullName",SqlDbType.NVarChar,50),15 new SqlParameter("@user_Power",SqlDbType.NVarChar,50)16 };17 pars[0].Value = userinfo.UserName;18 pars[1].Value = userinfo.UserPassword;19 pars[2].Value = userinfo.UserEmail;20 pars[3].Value = userinfo.User_BM;21 pars[4].Value = userinfo.User_FullName;22 pars[5].Value = userinfo.User_Power;23 24 return SqlHelper.ExcuteSQLReturnInt(sql, CommandType.Text, pars);25 }
3.删除功能:
**判断是否选中了行,选中确定之后删除!发送ajax请求到后台,然后从datagrid中删除该行。
前台js代码:
1 //del 2 $("#del").click(function () { 3 //判断选择行 4 var row = $("#dg").datagrid('getSelected'); 5 if (row) { 6 $.messager.confirm('删除', '您确认想要删除记录吗?', function (r) { 7 if (r) { 8 //删除 9 $.ajax({10 url: "/Manage/UserInfo_delById",11 type: "post",12 data: {13 "id": row.Id14 },15 success: function (data) {16 if (data == "ok") {17 $.messager.alert('提示', ' 删除成功!', 'info', function () {18 var index = $("#dg").datagrid('getRowIndex', row);19 $("#dg").datagrid('deleteRow', index);20 })21 } else {22 //失败23 $.messager.alert('提示', ' 删除失败,请重新选择', 'warning');24 }25 }26 })27 }28 });29 } else {30 $.messager.alert('提示', ' 请选择要删除的行!', 'warning');31 }32 })
Manage控制器中的UserInfo_delById()方法:
1 ///2 /// 删除用户 by id 3 /// 4 ///5 public ActionResult UserInfo_delById() 6 { 7 int id = Convert.ToInt32(Request["id"]); 8 9 if(new UserInfoService().UserInfo_del(id)>0)10 {11 return Content("ok");12 }13 else14 {15 return Content("no");16 }17 }
BLL中的UserInfoService中的UserInfo_del:
1 public int UserInfo_del(int id)2 {3 return userInfoDal.UserInfo_del(id);4 }
Dal中的UserInfoDal中的UserInfo_del方法:
1 ///2 /// 根据用户id删除 3 /// 4 /// 5 ///6 public int UserInfo_del(int id) 7 { 8 string sql = " delete from T_userInfo where id = @id "; 9 SqlParameter[] pars ={10 new SqlParameter("@id",SqlDbType.Int)11 };12 pars[0].Value = id;13 14 return SqlHelper.ExcuteSQLReturnInt(sql, CommandType.Text, pars);15 16 }
4.修改功能:
先将选中行的数据绑定到dialog中的控件中(使用easyui中的方式绑定数据,前台直接取值),然后在更新
js:
1 //edit 2 $("#edit").click(function () { 3 //判断选择的中 4 var row = $("#dg").datagrid('getSelected'); 5 if (row) { 6 7 $('#edit_dc').combobox({ 8 url: "/Manage/Return_BmAll", 9 valueField: 'Bm_no', 10 textField: 'Bm_mc' 11 }); 12 13 $.messager.confirm('编辑', '您想要编辑吗?', function (r) { 14 if (r) { 15 //先绑定 16 $("#edit_username").textbox('setText', row.UserName); 17 $("#edit_userpassword").textbox('setText', row.UserPassword); 18 $("#edit_userpassword").textbox({ readonly: true }); 19 $("#edit_email").textbox('setText', row.UserEmail); 20 $("#edit_dc").combobox('setValue', row.User_BM); 21 $("#edit_fullname").textbox('setText', row.User_FullName); 22 if (row.User_Power == '普通用户权限') { 23 $("#edit_cc").combobox('setValue', '1'); 24 } else if (row.User_Power == '管理员权限') { 25 $("#edit_cc").combobox('setValue', '2'); 26 } else if (row.User_Power == '超级管理员权限') { 27 $("#edit_cc").combobox('setValue', '3'); 28 } 29 30 //打开对话框编辑 31 $("#dia_edit").dialog({ 32 title: "编辑用户", 33 width: 600, 34 height: 500, 35 buttons: [{ 36 text: '更新', 37 iconCls: 'icon-ok', 38 handler: function () { 39 //更新 40 //验证 41 $.messager.confirm('确认', '您确认要更新吗?', function (r) { 42 if (r) { 43 var obj_username = $("#edit_username").textbox('getText'); 44 var obj_userpassword = $("#newpassword").textbox('getText'); 45 var obj_userpassword_confirm = $("#newpassword_confirm").textbox('getText'); 46 var obj_email = $("#edit_email").textbox('getText'); 47 var obj_department = $("#edit_dc").combobox('getValue'); 48 var obj_fullname = $("#edit_fullname").textbox('getText'); 49 50 if (obj_username == "" || obj_userpassword == "" || obj_userpassword_confirm == "" || obj_email == "" || obj_fullname == "") { 51 $.messager.alert('提示', ' 请填写相关必填项!', 'warning'); 52 return; 53 } 54 if (obj_userpassword != obj_userpassword_confirm) { 55 $.messager.alert('提示', ' 两次输入的密码必须一致!', 'warning'); 56 return; 57 } 58 59 $.ajax({ 60 url: "/Manage/Update_AllUserInfo", 61 type: "post", 62 data: { 63 "id": row.Id, 64 "username": $("#edit_username").textbox('getText'), 65 "userpassword": $("#newpassword_confirm").textbox('getText'), 66 "useremail": $("#edit_email").textbox('getText'), 67 "bm": $("#edit_dc").combobox('getValue'), 68 "fullname": $("#edit_fullname").textbox('getText'), 69 "power": $("#edit_cc").combobox('getValue') 70 }, 71 success: function (data) { 72 if (data == "ok") { 73 // 74 $.messager.alert("提示", "更新成功!", "info", function () { 75 // 76 //$("#add_bmno").textbox("setText", ""); 77 $("#newpassword").textbox("setText", ""); 78 $("#newpassword_confirm").textbox("setText", ""); 79 $('#dia_edit').dialog('close'); 80 $('#dg').datagrid('reload'); 81 }) 82 } 83 else { 84 // 85 $.messager.alert("提示", "更新异常,联系管理员!", "info"); 86 } 87 } 88 }) 89 } 90 }) 91 } 92 }, { 93 text: '取消', 94 iconCls: 'icon-no', 95 handler: function () { 96 //关闭之前要清空 97 $("#newpassword").textbox("setText", ""); 98 $("#newpassword_confirm").textbox("setText", ""); 99 $('#dia_edit').dialog('close');100 }101 }],102 modal: true103 })104 }105 });106 107 } else {108 $.messager.alert('提示', ' 请选择要编辑的行!', 'warning');109 }110 111 })
控制器中的方法:
1 ///2 /// 更新用户所有信息 3 /// 4 ///5 public ActionResult Update_AllUserInfo() 6 { 7 // //id,userName,userPassword,userEmail,user_BM,user_FullName,user_Power 8 T_UserInfo userinfo = new T_UserInfo(); 9 10 userinfo.Id =Convert.ToInt32( Request["id"]);11 userinfo.UserName = Request["username"];12 userinfo.UserPassword = Request["userpassword"];13 userinfo.UserEmail = Request["useremail"];14 userinfo.User_BM = Request["bm"];15 userinfo.User_FullName = Request["fullname"];16 userinfo.User_Power = Request["power"];17 18 if(new UserInfoService().Update_AllInfo(userinfo)>0)19 {20 return Content("ok");21 }22 else23 {24 return Content("no");25 }26 }
BLL中的UserInfoService的Update_AllInfo方法:
1 public int Update_AllInfo(T_UserInfo userinfo)2 {3 return userInfoDal.Update_AllInfo(userinfo);4 }
Dal中的UserInfoDal的Update_AllInfo方法:
1 ///2 /// 更新用户的所有信息 3 /// 4 /// 5 ///6 public int Update_AllInfo(T_UserInfo userinfo) 7 { 8 //id,userName,userPassword,userEmail,user_BM,user_FullName,user_Power 9 string sql = " update T_userInfo set userName=@userName,userPassword=@userPassword,userEmail=@userEmail,user_BM=@user_BM,user_FullName=@user_FullName,user_Power=@user_Power where id=@id ";10 SqlParameter[] pars ={11 new SqlParameter("@userName",SqlDbType.NVarChar,50),12 new SqlParameter("@userPassword",SqlDbType.NVarChar,50),13 new SqlParameter("@userEmail",SqlDbType.NVarChar,50),14 new SqlParameter("@user_BM",SqlDbType.NVarChar,50),15 new SqlParameter("@user_FullName",SqlDbType.NVarChar,50),16 new SqlParameter("@user_Power",SqlDbType.NVarChar,50),17 new SqlParameter("@id",SqlDbType.NVarChar,50)18 };19 pars[0].Value = userinfo.UserName;20 pars[1].Value = userinfo.UserPassword;21 pars[2].Value = userinfo.UserEmail;22 pars[3].Value = userinfo.User_BM;23 pars[4].Value = userinfo.User_FullName;24 pars[5].Value = userinfo.User_Power;25 pars[6].Value = userinfo.Id;26 27 return SqlHelper.ExcuteSQLReturnInt(sql, CommandType.Text, pars);28 }
5.刷新功能:
datagrid的刷新
1 //reload2 $("#reload").click(function () {3 //4 $('#dg').datagrid('reload');5 })