简单的人员管理系统
要注意的细节问题：
1、展示细节
2、用户名重复验证
3、着急
4、日期判断
5、修改页面无法提交
6、编辑时，如密码不填，则保留原有密码
主页面
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <form id="form1" runat="server"> <table style="width: 100%; background-color: indigo; text-align: center;"> <tr style="font-size: 20px; color: white;"> <td>编号</td> <td>用户名</td> <td>密码</td> <td>昵称</td> <td>性别</td> <td>生日</td> <td>民族</td> <td>操作</td> </tr> <asp:Repeater ID="Repeater1" runat="server"> <ItemTemplate> <tr style="background-color: white;"> <td><%#Eval("ids") %></td> <td><%#Eval("username") %></td> <td><%#Eval("password") %></td> <td><%#Eval("nickname") %></td> <td><%#Eval("sexstr") %></td> <td><%#Eval("birthday") %></td> <td><%#Eval("nation") %></td> <td> <%--<asp:Button ID="Button2" runat="server" Text="修改" />--%> <a href="xiugai.aspx?i=<%#Eval("ids") %>"> <asp:Label ID="Label1" runat="server" Text="修改"></asp:Label></a> <asp:Label ID="Label2" runat="server" Text="删除"></asp:Label> </td> </tr> </ItemTemplate> </asp:Repeater> </table> <div style="width:100%;text-align:center;"> <asp:Button ID="Button1" runat="server" Text="" style="height:100px;width:100px;background-image:url(images/cat1.png);background-repeat:no-repeat"/> </div> </form> </body> </html>
添加信息页面
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="tianjia.aspx.cs" Inherits="tianjia" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <form id="form1" runat="server"> <div style="width: 100%; text-align: center;"> <h1 style="color: pink">添加新用户</h1> <div style="margin-left:000px"> 用户名：<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><div><asp:Label ID="Label1" runat="server" Text=""></asp:Label><br /></div></div> <div style="margin-left:015px"> 密码：<asp:TextBox ID="TextBox2" runat="server" TextMode="Password"></asp:TextBox><div><asp:Label ID="Label2" runat="server" Text=""></asp:Label><br /></div></div> <div style="margin-left:-15px">重复密码：<asp:TextBox ID="TextBox3" runat="server" TextMode="Password"></asp:TextBox><div><asp:Label ID="Label3" runat="server" Text=""></asp:Label><br /></div></div> <div style="margin-left:17px"> 昵称：<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox><asp:Label ID="Label4" runat="server" Text=""></asp:Label><br /></div> <div style="margin-left:573px"><span style="float: left">性别：</span></div> <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal"> <asp:ListItem Text="男" Value="true" Selected="True"></asp:ListItem> <asp:ListItem Text="女" Value="false"></asp:ListItem> </asp:RadioButtonList> <div style="margin-left:27px"> 生日：<asp:DropDownList ID="dr_year" runat="server"></asp:DropDownList>年 <asp:DropDownList ID="dr_mouth" runat="server"></asp:DropDownList>月 <asp:DropDownList ID="dr_day" runat="server"></asp:DropDownList>日<br /> </div> <div style="margin-left:-100px"> 民族：<asp:DropDownList ID="dr_nation" runat="server"></asp:DropDownList><br /></div> <asp:Button ID="Button1" OnClientClick="return go()" runat="server" Text="注册" /> </div> </form> </body> </html> <script type="text/javascript"> var p1 = document.getElementById("TextBox2"); var p2 = document.getElementById("TextBox3"); var pwdok = false; var nick = false; var name = document.getElementById("TextBox1"); p1.onkeyup = function(){mima(p1,p2)}; p2.onkeyup = function(){mima(p1,p2)}; function mima(pwd1, pwd2) { if (pwd1.value.length > 0) { if (pwd1.value != pwd2.value) { document.getElementById("Label3").innerText = "两次密码不一致"; document.getElementById("Label3").style.color = "red"; pwdok = false; } else { document.getElementById("Label3").innerText = "密码输入成功"; document.getElementById("Label3").style.color = "green"; pwdok = true; } } else { document.getElementById("Label3").innerText = "密码不能为空"; document.getElementById("Label3").style.color = "red"; pwdok = false; } } document.getElementById("TextBox4").onkeyup = function () { if (this.value.length > 0) { nick = true; } else { nick = false;} } function go() { return pwdok && nick; } </script>
修改页面
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="xiugai.aspx.cs" Inherits="xiugai" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <form id="form1" runat="server"> <div style="width: 100%; height: 100%; text-align: center;"> <div style="width: 500px; height: 500px; border-color: red; text-align: center"> 账号：<asp:TextBox ID="TextBox1" runat="server" ReadOnly="true"></asp:TextBox><br /> 密码：<asp:TextBox ID="TextBox2" runat="server" TextMode="Password"></asp:TextBox><br /> 重复密码：<asp:TextBox ID="TextBox3" runat="server" TextMode="Password"></asp:TextBox> <asp:Label ID="Label1" runat="server" Text=""></asp:Label><br /> 昵称：<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox><br /> <div style="float: left; margin-left: 160px">性别： </div> <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal"> <asp:ListItem Text="男" Value="true" Selected="True"></asp:ListItem> <asp:ListItem Text="女" Value="false"></asp:ListItem> </asp:RadioButtonList> 生日：<asp:DropDownList ID="dr_year" runat="server"></asp:DropDownList>年 <asp:DropDownList ID="dr_mouth" runat="server"></asp:DropDownList>月 <asp:DropDownList ID="dr_day" runat="server"></asp:DropDownList>日<br /> 民族：<asp:DropDownList ID="dr_nation" runat="server"></asp:DropDownList><br /> </div> <asp:Button ID="Button1" runat="server" OnClientClick="return go()" Text="确认" /> </div> </form> </body> </html> <script type="text/javascript"> var p1 = document.getElementById("TextBox2"); var p2 = document.getElementById("TextBox3"); var pwdok = false; var nick = false; p1.onkeyup = function () { mima(p1, p2) }; p2.onkeyup = function () { mima(p1, p2) }; function mima(pwd1, pwd2) { if (pwd1.value.length > 0) { if (pwd1.value != pwd2.value) { document.getElementById("Label1").innerText = "两次密码不一致"; document.getElementById("Label1").style.color = "red"; pwdok = false; } else { document.getElementById("Label1").innerText = "密码输入成功"; document.getElementById("Label1").style.color = "green"; pwdok = true; } } else { document.getElementById("Label1").innerText = "密码不能为空"; document.getElementById("Label1").style.color = "red"; pwdok = false; } } document.getElementById("TextBox4").onkeyup = function () { if (this.value.length > 0) { nick = true; } else { nick = false; } } function go() { return pwdok && nick;; } document.getElementById("dr_year").onchange = function () { var mon = document.getElementById("dr_mouth"); var day = document.getElementById("dr_day"); if (this.value % 4 == 0 && this.value % 100 != 0 || this.value % 400 == 0) { alert("aaa"); day.options.length = 0; if (mon.value == 2) { alert("aaa"); for (var i = 1; i < 30; i++) { var op = document.createElement("option"); op.value = i; op.innerHTML = i; day.appendChild(op); } } else if (mon.value == 1 || mon.value == 3 || mon.value == 5 || mon.value == 7 || mon.value == 8 || mon.value == 10 || mon.value == 12) { alert("a"); for (var i = 1; i < 32; i++) { var op = document.createElement("option"); op.value = i; op.innerHTML = i; day.appendChild(op); } } else { alert("aaaaaaa"); for (var i = 1; i < 31; i++) { var op = document.createElement("option"); op.value = i; op.innerHTML = i; day.appendChild(op); } } } //else { // day.options.length = 0; // if (mon.value == 2) { // for (var i = 1; i < 29; i++) { // var op = document.createElement("option"); // op.value = i; // op.innerHTML = i; // day.appendChild(op); // } // } // else if (mon.value == 1 || mon.value == 3 || mon.value == 5 || mon.value == 7 || mon.value == 8 || mon.value == 10 || mon.value == 12) { // for (var i = 1; i < 32; i++) { // var op = document.createElement("option"); // op.value = i; // op.innerHTML = i; // day.appendChild(op); // } // } // else { // for (var i = 1; i < 31; i++) { // var op = document.createElement("option"); // op.value = i; // op.innerHTML = i; // day.appendChild(op); // } // } //} }; document.getElementById("dr_mouth").onchange = function () { var mon = document.getElementById("dr_mouth"); var day = document.getElementById("dr_day"); day.options.length = 0; if (mon.value == 2) { alert("bbb"); if (this.value % 4 == 0 && this.value % 100 != 0 || this.value % 400 == 0) { alert("bbbbb"); for (var i = 1; i < 30; i++) { var op = document.createElement("option"); op.value = i; op.innerHTML = i; day.appendChild(op); } } else { alert("b"); for (var i = 1; i < 29; i++) { var op = document.createElement("option"); op.value = i; op.innerHTML = i; day.appendChild(op); } } } else if (mon.value == 1 || mon.value == 3 || mon.value == 5 || mon.value == 7 || mon.value == 8 || mon.value == 10 || mon.value == 12) { for (var i = 1; i < 32; i++) { var op = document.createElement("option"); op.value = i; op.innerHTML = i; day.appendChild(op); } } else { for (var i = 1; i < 31; i++) { var op = document.createElement("option"); op.value = i; op.innerHTML = i; day.appendChild(op); } } } </script>
