用户注册页面的制作,用 4 个Panel 来实现,里面包含全部源码

Posted on 2006-10-22 22:48 孤峰皓月阅读(2090) 评论(0) 收藏举报

用户注册: 这里是用 4个Panel 的Visible属性来实现注册步骤.

首先看前台页面:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="reg1.aspx.cs" Inherits="test_register_reg1" %>
2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4

<html xmlns="http://www.w3.org/1999/xhtml" >
6

<head runat="server">
7

<title>无标题页</title>
8

</head>
9

<body>
10

<form id="form1" runat="server">
11

<div style="text-align: center">
12

<asp:Panel ID="Panel1" runat="server" BorderColor="#0000C0" BorderStyle="Dotted"
13

BorderWidth="1px" Height="221px" Width="631px">
14

<table style="height: 100%">
15

<tr>
16

<td style="font-weight: bold; font-size: 18pt; width: 635px; color: gold; height: 41px;
17

background-color: #9999ff">
18

用户注册</td>
19

</tr>
20

<tr>
21

<td align="left" style="width: 600px; height: 38px">
22

注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,注册协议,</td>
23

</tr>
24

<tr>
25

<td style="width: 635px; height: 50px">
26

<asp:RadioButton ID="rBtnAgree" runat="server" GroupName="agree" Text="同意" />
27

<asp:RadioButton ID="rBtnNotAgree" runat="server" Checked="True" GroupName="agree"
28

Text="不同意" /></td>
29

</tr>
30

<tr>
31

<td style="width: 635px; height: 37px; background-color: silver">
32

<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="下一步" /></td>
33

</tr>
34

</table>
35

</asp:Panel>
36

<asp:Panel ID="Panel2" runat="server" BorderColor="#0000C0" BorderStyle="Dotted"
37

BorderWidth="1px" Height="221px" Visible="False" Width="631px">
38

<table border="1" cellpadding="0" cellspacing="0" style="width: 622px">
39

<tr>
40

<td colspan="3" style="font-weight: bold; font-size: 18px; color: #ffff00; height: 46px;
41

background-color: #6699ff">
42

用户登录</td>
43

</tr>
44

<tr>
45

<td style="width: 174px; height: 35px; text-align: right">
46

用户名：</td>
47

<td colspan="2" style="height: 35px; text-align: left">
48

<asp:TextBox ID="txtUserName" runat="server"></asp:TextBox><asp:RequiredFieldValidator
49

ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtUserName" Display="Dynamic"
50

ErrorMessage="用户名不能为空">*</asp:RequiredFieldValidator>
51

<asp:CustomValidator ID="CustomValidator1" runat="server" ControlToValidate="txtUserName"
52

Display="Dynamic" ErrorMessage="用户名已经存在" OnServerValidate="CustomValidator1_ServerValidate">*</asp:CustomValidator></td>
53

</tr>
54

<tr>
55

<td style="width: 174px; height: 29px; text-align: right">
56

密码：</td>
57

<td colspan="2" style="height: 29px; text-align: left">
58

<asp:TextBox ID="txtUserPwd" runat="server"></asp:TextBox><asp:RequiredFieldValidator
59

ID="RequiredFieldValidator2" runat="server" ControlToValidate="txtUserPwd" Display="Dynamic"
60

ErrorMessage="密码不能为空">*</asp:RequiredFieldValidator></td>
61

</tr>
62

<tr>
63

<td style="width: 174px; height: 29px; text-align: right">
64

确认密码：</td>
65

<td colspan="2" style="height: 29px; text-align: left">
66

<asp:TextBox ID="txtUserPwdAgain" runat="server"></asp:TextBox>
67

<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="txtUserPwdAgain"
68

Display="Dynamic" ErrorMessage="确认密码不能为空">*</asp:RequiredFieldValidator>
69

<asp:CompareValidator ID="CompareValidator1" runat="server" ControlToCompare="txtUserPwd"
70

ControlToValidate="txtUserPwdAgain" ErrorMessage="两次密码输入不相同">*</asp:CompareValidator></td>
71

</tr>
72

<tr>
73

<td colspan="3" style="height: 60px">
74

<asp:ValidationSummary ID="ValidationSummary1" runat="server" ShowMessageBox="True" />
75

<br />
76

<asp:Button ID="Button2" runat="server" Text="下一步" OnClick="Button2_Click" /></td>
77

</tr>
78

</table>
79

</asp:Panel>
80

<asp:Panel ID="Panel3" runat="server" BorderColor="#0000C0" BorderStyle="Dotted"
81

BorderWidth="1px" Height="221px" Visible="False" Width="631px">
82

<table border="1" cellpadding="3" style="width: 465pt">
83

<tr>
84

<td colspan="3" style="height: 48px; color: #ff0000; background-color: #ccccff;">
85

用户基本信息<br />
86

<asp:ValidationSummary ID="ValidationSummary2" runat="server" ShowMessageBox="True" />
87

</td>
88

</tr>
89

<tr>
90

<td style="width: 75px; height: 27px">
91

真实姓名:</td>
92

<td align="left" style="width: 45px; height: 27px">
93

<asp:TextBox ID="txtRealName" runat="server" Width="145px">aaaa</asp:TextBox>
94

<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="txtRealName"
95

ErrorMessage="真实姓名不能为空">*</asp:RequiredFieldValidator></td>
96

<td rowspan="5" style="width: 100px; text-align: center;">
97

<asp:Image ID="Image1" runat="server" Height="157px" Width="126px" /></td>
98

</tr>
99

<tr>
100

<td style="width: 75px; height: 25px">
101

性别:</td>
102

<td align="left" style="width: 45px; height: 25px">
103

<asp:RadioButtonList ID="rBtnlSex" runat="server" RepeatDirection="Horizontal" TextAlign="Left">
104

<asp:ListItem Selected="True">男</asp:ListItem>
105

<asp:ListItem>女</asp:ListItem>
106

</asp:RadioButtonList>
107

</td>
108

</tr>
109

<tr>
110

<td style="width: 75px; height: 38px">
111

出生日期:</td>
112

<td align="left" style="width: 45px; height: 38px">
113

<asp:TextBox ID="txtBirth" runat="server" Width="143px">1980-1-1</asp:TextBox>
114

<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="txtBirth"
115

Display="Dynamic" ErrorMessage="出生日期不能为空">*</asp:RequiredFieldValidator>
116

<asp:RangeValidator ID="RangeValidator1" runat="server" ControlToValidate="txtBirth"
117

ErrorMessage="日期超出范围" MaximumValue="2000-01-01" MinimumValue="1950-01-01">*</asp:RangeValidator></td>
118

</tr>
119

<tr>
120

<td style="width: 75px; height: 36px">
121

省份:</td>
122

<td align="left" style="width: 45px; height: 36px">
123

<asp:DropDownList ID="selSheng" runat="server" Width="146px">
124

</asp:DropDownList></td>
125

</tr>
126

<tr>
127

<td style="width: 75px; height: 41px">
128

城市:</td>
129

<td align="left" style="width: 45px; height: 41px">
130

<asp:DropDownList ID="selShi" runat="server" Width="150px">
131

</asp:DropDownList></td>
132

</tr>
133

<tr>
134

<td style="width: 75px">
135

教育程度:</td>
136

<td style="width: 45px; text-align: left;">
137

<asp:DropDownList ID="selXueli" runat="server" Width="148px">
138

<asp:ListItem>大专</asp:ListItem>
139

<asp:ListItem>本科</asp:ListItem>
140

<asp:ListItem>研究生</asp:ListItem>
141

</asp:DropDownList></td>
142

<td style="width: 100px">
143

<asp:FileUpload ID="FileUpload1" runat="server" Height="24px" Width="57px" />
144

<asp:Button ID="Button3" runat="server" Text="上传" OnClick="Button3_Click" /></td>
145

</tr>
146

<tr>
147

<td style="width: 75px">
148

月收入:</td>
149

<td style="width: 45px; text-align: left;">
150

<asp:DropDownList ID="selShouru" runat="server" Width="149px">
151

<asp:ListItem>1000以下</asp:ListItem>
152

<asp:ListItem>1000~2000</asp:ListItem>
153

<asp:ListItem>2000以上</asp:ListItem>
154

</asp:DropDownList></td>
155

<td style="width: 100px">
156

<asp:Label ID="lblImgErr" runat="server"></asp:Label></td>
157

</tr>
158

<tr>
159

<td colspan="3" style="height: 3px">
160

<hr style="color: #ff0033; background-color: #ffccff" />
161

</td>
162

</tr>
163

<tr>
164

<td style="width: 75px">
165

兴趣爱好:</td>
166

<td colspan="2" style="text-align: left">
167

<asp:CheckBoxList ID="chkAhao" runat="server" RepeatDirection="Horizontal">
168

<asp:ListItem>游戏</asp:ListItem>
169

<asp:ListItem>体育</asp:ListItem>
170

<asp:ListItem>购物</asp:ListItem>
171

<asp:ListItem>旅游</asp:ListItem>
172

<asp:ListItem>交友</asp:ListItem>
173

<asp:ListItem>读书</asp:ListItem>
174

</asp:CheckBoxList></td>
175

</tr>
176

<tr>
177

<td colspan="3" style="height: 48px; background-color: #99ccff">
178

<asp:Button ID="Button4" runat="server" Text="下一步" OnClick="Button4_Click" /></td>
179

</tr>
180

</table>
181

</asp:Panel>
182

<asp:Panel ID="Panel4" runat="server" BorderColor="#0000C0" BorderStyle="Dotted"
183

BorderWidth="1px" Height="221px" Visible="False" Width="631px">
184

<table border="1" cellpadding="3" style="width: 630px; height: 207px">
185

<tr>
186

<td colspan="2" style="font-weight: bold; font-size: 18pt; color: #ff0000; height: 45px;
187

background-color: #9999ff">
188

联系方式</td>
189

</tr>
190

<tr>
191

<td style="width: 36px">
192

电子邮箱:</td>
193

<td style="width: 100px; text-align: left">
194

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></td>
195

</tr>
196

<tr>
197

<td style="width: 36px; height: 27px">
198

邮政编码:</td>
199

<td style="width: 100px; height: 27px; text-align: left">
200

<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox></td>
201

</tr>
202

<tr>
203

<td style="width: 36px; height: 31px">
204

家庭住址:</td>
205

<td style="width: 100px; height: 31px; text-align: left">
206

<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox></td>
207

</tr>
208

<tr>
209

<td style="width: 36px">
210

电话号码:</td>
211

<td style="width: 100px; text-align: left">
212

<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox></td>
213

</tr>
214

<tr>
215

<td colspan="2" style="color: #cccccc; height: 36px; background-color: #cccccc">
216

<asp:Button ID="Button5" runat="server" Text="完成注册" OnClick="Button5_Click" /></td>
217

</tr>
218

</table>
219

</asp:Panel>
220

 
221

222

</div>
223

</form>
224

</body>
225

</html>
226

后台页面:

using System;
2

using System.Data;
3

using System.Configuration;
4

using System.Collections;
5

using System.Web;
6

using System.Web.Security;
7

using System.Web.UI;
8

using System.Web.UI.WebControls;
9

using System.Web.UI.WebControls.WebParts;
10

using System.Web.UI.HtmlControls;
11

using System.Data.SqlClient;
12

public partial class test_register_reg1 : System.Web.UI.Page
13

{
14

protected void Page_Load(object sender, EventArgs e)
15

{
16

SqlConnection con = DB2.createConnection();
17

con.Open();
18

SqlCommand cmd = new SqlCommand("select * from province",con);
19

SqlDataReader sdr = cmd.ExecuteReader();
20

this.selSheng.DataSource = sdr;
21

this.selSheng.DataTextField = "proName";
22

this.selSheng.DataValueField = "proID";
23

this.selSheng.DataBind();
24

sdr.Close();
25

}
27

protected void Button1_Click(object sender, EventArgs e)
28

{
29

if(this.rBtnAgree.Checked)
30

{
31

this.Panel1.Visible = false;
32

this.Panel2.Visible = true;
33

}
34

}
35

protected void CustomValidator1_ServerValidate(object source, ServerValidateEventArgs args)
36

{
37

string UserName = args.Value; // args.Value 控件的值;
38

if(DBlogin.Judge(UserName))
39

{
40

args.IsValid = false; // args.IsValid = true;表示该控件已经通过验证.
41

}
42

else
43

{
44

args.IsValid = true;
45

}
46

}
47

protected void Button2_Click(object sender, EventArgs e)
48

{
49

if (this.IsValid)
50

{
51

this.Panel2.Visible = false; //结束第二步.
52

this.Panel3.Visible = true; //进入注册页面第三步.
53

}
54

}
55

protected void Button3_Click(object sender, EventArgs e)
56

{
57

/*这里是一种简单的做法,学习过程中还是自己再好好做一个吧.
58

this.FileUpload1.PostedFile.SaveAs(Server.MapPath("up")+"\\1.gif");
59

this.Image1.ImageUrl = Server.MapPath("up") + "\\1.gif";
60

*/
61

//下面这个是比较好一点的方法,判断用户输入的文件格式,
63

//再按系统日期命名文件,以防重复使用文件名.
64

string FileName = this.FileUpload1.FileName; //获取文件全名;
65

string FileExe = FileName.Substring(FileName.LastIndexOf(".")+1).ToLower();
66

//获取扩展名;
67

//Substring() 获取从指定位置开始且指定长度的字符串.
68

//获取字符串最后一个匹配项的索引位置.
69

//将扩展名转换为小写.
70

//如果扩展名合法,则保存文件,否则出错误信息.
72

//获取时间日期: System.DateTime.Now.ToString("yyyyMMddhhmmss")
73

//获取微秒 System.DateTime.Now.ToString("ms")
74

//精确到微秒: System.DateTime.Now.ToString("yyyyMMddhhmmssms")
75

//
76

/* 使用随机数: 取1-1000的随机数,再加上扩展名.
77

Random rdm = new Random();
78

FileName = rdm.Next(1,1000).ToString() + FileExe;
79

*/
80

if(FileExe=="gif" || FileExe=="jpg" || FileExe=="bmp" || FileExe=="png")
81

{
82

string ImgPath = Server.MapPath("up") +"/"+ System.DateTime.Now.ToString("yyyyMMddhhmmssms").ToString() + "." +FileExe;
83

this.FileUpload1.PostedFile.SaveAs(ImgPath);
84

this.Image1.ImageUrl = ImgPath;
85

}
86

else
87

{
88

lblImgErr.Text = "上传文件格式出错!";
89

Response.Write("<script language='javascript'>alert('你上传的文件格式出错!')</script>");
90

}
91

//Response.Write("上传的文件名是:"+FileName);
93

}
94

protected void Button4_Click(object sender, EventArgs e)
96

{
97

if(this.IsValid)
98

{
99

this.Panel3.Visible = false;
100

this.Panel4.Visible = true;
101

}
102

}
103

protected void Button5_Click(object sender, EventArgs e)
104

{
105

Response.Write("用户"+this.txtUserName.Text+"注册成功！");
106

//这里直接打印＂注册成功消息＂，在同一个页面中,虽然服务器与本地来回传递,但控件中的值还是存在的
107

//可以用 this.txtUserName.Text 等获取.
108

}
109

}

刷新页面返回顶部

专注WEB开发技术 @ 修身、齐家、治国、平天下!

公告

用户注册页面的制作,用 4 个Panel 来实现,里面包含全部源码