/
signup1.html
148 lines (139 loc) · 4.31 KB
/
signup1.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
<!DOCTYPE html>
<html>
<head>
<title>Welcome To Registration Form</title>
<style>
body
{
margin:0px;
background-color:#f26724;
background-image:url(image/background.jpg);
color:#f9fcf5;
font-family:Arial, Helvetica, sans-serif;
}
#main{width:600px; height:auto; overflow:hidden; padding-bottom:20px; margin-left:auto; margin-right:auto;
border-radius:5px; padding-left:10px; margin-top:100px; border-top:3px double #f1f1f1;
border-bottom:3px double #f1f1f1; padding-top:20px;
}
#main table{font-family:"Comic Sans MS", cursive;}
/* css code for textbox */
#main .tb{height:28px; width:230px; border:1px solid #f26724; color:#fd7838; font-weight:bold; border-left:5px solid #f7f7f7; opacity:0.9;}
#main .tb:focus{height:28px; border:1px solid #f26724; outline:none; border-left:5px solid #f7f7f7;}
/* css code for button*/
#main .btn{width:150px; height:32px; outline:none; color:#f7f7f7; font-weight:bold; border:0px solid #f26724;
text-shadow: 0px 0.5px 0.5px #fff; border-radius: 2px; font-weight: 600; color: #f26724; letter-spacing: 1px;
font-size:14px; background-color:#f1f1f1; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s;}
#main .btn:hover{background-color:#f26724; outline:none; border-radius: 2px; color:#f1f1f1; border:1px solid #f1f1f1;
-webkit-transition: 1s; -moz-transition: 1s; transition: 1s; }
</style>
<script>
function registration()
{
var name= document.getElementById("t1").value;
var email= document.getElementById("t2").value;
var uname= document.getElementById("t3").value;
var pwd= document.getElementById("t4").value;
var cpwd= document.getElementById("t5").value;
//email id expression code
var pwd_expression = /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-])/;
var letters = /^[A-Za-z]+$/;
var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
if(name=='')
{
alert('Please enter your name');
}
else if(!letters.test(name))
{
alert('Name field required only alphabet characters');
}
else if(email=='')
{
alert('Please enter your user email id');
}
else if (!filter.test(email))
{
alert('Invalid email');
}
else if(uname=='')
{
alert('Please enter the user name.');
}
else if(!letters.test(uname))
{
alert('User name field required only alphabet characters');
}
else if(pwd=='')
{
alert('Please enter Password');
}
else if(cpwd=='')
{
alert('Enter Confirm Password');
}
else if(!pwd_expression.test(pwd))
{
alert ('Upper case, Lower case, Special character and Numeric letter are required in Password filed');
}
else if(pwd != cpwd)
{
alert ('Password not Matched');
}
else if(document.getElementById("t5").value.length < 6)
{
alert ('Password minimum length is 6');
}
else if(document.getElementById("t5").value.length > 12)
{
alert ('Password max length is 12');
}
else
{
alert(thankyou);
}
}
</script>
</head>
<body>
<!-- Main div code -->
<div id="main">
<div class="h-tag">
<h2>Create Your Account</h2>
</div>
<!-- create account div -->
<div class="login">
<form action="successful.html" method="post">
<table cellspacing="2" align="center" cellpadding="8" border="0">
<tr>
<td align="right">Enter Name :</td>
<td><input type="text" placeholder="Enter user here" id="t1" class="tb" /></td>
</tr>
<tr>
<td align="right">Enter Email ID :</td>
<td><input type="text" placeholder="Enter Email ID here" id="t2" class="tb" /></td>
</tr>
<tr>
<td align="right">Enter Username :</td>
<td><input type="text" placeholder="Enter Username here" id="t3" class="tb" /></td>
</tr>
<tr>
<td align="right">Enter Password :</td>
<td><input type="password" placeholder="Enter Password here" id="t4" class="tb" /></td>
</tr>
<tr>
<td align="right">Enter Confirm Password :</td>
<td><input type="password" placeholder="Confirm Password here" id="t5" class="tb" /></td>
</tr>
<tr>
<td></td>
<td>
<input type="reset" value="Clear Form" id="res" class="btn" />
<input type="submit" value="Create Account" class="btn" onclick="registration()" /></td>
</tr>
</table>
</form>
</div>
<!-- create account box ending here.. -->
</div>
<!-- Main div ending here... -->
</body>
</html>