TUGAS PWEB MINGGU KE-4 (MEMBUAT LAMAN LOGIN DAN SIGN UP)
Link Repository : https://github.com/tengkureinaldo/tengkureinaldo3.github.io
Link Website : https://tengkureinaldo.github.io/tengkureinaldo3.github.io/
1. index.html
<html>
<head>
<title>Login Page</title>
</head>
<body>
<h3>LOGIN</h3>
<form="Login_form" onsubmit="submit_form()" >
<h4>USERNAME</h4>
<input type="text" placeholder="enter your email id" />
<h4>PASSWORD</h4>
<input type="password" placeholder="enter your password" /></br></br>
<input type="submit" value="login" />
<input type="button" value="SignUp" onclick="create()" />
</form>
<script type="text/javascript">
function submit_form() {
alert("Login Successfully");
}
function create() {
window.location = "signup.html";
}
</script>
</body>
</html>
2. signup.html
<html>
<head>
<title>
SignUp Page
</title>
</head>
<body align="center">
<h1>
CREATE YOUR ACCOUNT
</h1>
<table cellspacing="2" align="center" cellpadding="8" border="0">
<tr>
<td> Name</td>
<td><input type="text" placeholder="enter your name" id="n1"></td>
</tr>
<tr>
<td> Email</td>
<td><input type="text" placeholder="enter your email id" id="e1"></td>
</tr>
<tr>
<td> Set Password</td>
<td><input type="password" placeholder="set a password" id="p1"></td>
</tr>
<tr>
<td> Confirm Password</td>
<td><input type="password" placeholder="confirm your password" id="p2"></td>
</tr>
<tr>
<td><input type="submit" value="create" onclick="create_account()" />
</table>
<script type="text/javascript">
function create_account(){
var n=document.getElementById("n1").value;
var e=document.getElementById("e1").value;
var p=document.getElementById("p1").value;
var cp=document.getElementById("p2").value;
//code for password validation
var letters = /^[A-Za-z]+$/;
var email_val = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
//other calidations requiers code
if(n==''||e=''||p==''||cp==''){
alert("enter each details correctly");
} else if(!letters.test(n)){
alert("Name is incorrect must contain alphabets only");
} else if(!email_val.test(e)){
alert("Invalid email format please enter valid email id");
} else if(p!=cp){
alert("Passwords not matching");
} else if(document.getElementById("p1").value.length > 12){
alert("password maximum length is 12");
} else if(document.getElementById("p1").value.length < 6){
alert("password minimum length is 6");
} else {
alert("your account has been created succesfully...Redirecting to javaTpoint.com")
window.location="https://www.javatpoint.com/";
}
}
</script>
</body>
</html>
Komentar
Posting Komentar