PWEB C Tugas 3 - Membuat Login dan Signup JS
Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="index.css">
</head>
<body>
<h3> LOGIN </h3>
<form id='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>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</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 id="n1" type="text" placeholder="Enter your name" /></td>
</tr>
<tr>
<td>Email </td>
<td> <input id="e1" type="text" placeholder="Enter your email id" /></td>
</tr>
<tr>
<td> Set Password</td>
<td> <input id="p1" type="password" placeholder="Set a password" /></td>
</tr>
<tr>
<td>Confirm Password</td>
<td> <input id="p2" type="password" placeholder="Confirm your password" /></td>
</tr>
<tr>
<td> <input type="submit" value="Create" onClick="create_account()" /></td>
</tr>
</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;
var letters = /^[A-Za-z]+$/;
var email_val = /^[a-zA-Z0-9_\.\-]+\@([a-zA-Z0-9\-]+([a-zA-Z0-9](2,4)))+$/;
if(n==''||e==''||p==''||cp==''){
alert("Masukkan tiap data secara benar");
}
else if(!letters.test(n)){
alert("Nama salah, harus mengandung huruf alfabet");
}
else if(p!=cp){
alert("Kata Sandi tidak cocok!");
}
else if(document.getElementById("p1").value.length > 12){
alert("Batas maksimum Kata Sandi sepanjang 12 karakter");
}
else if(document.getElementById("p1").value.length < 6){
alert("Minimum Kata Sandi sepanjang 6 karakter");
}
else{
alert("Akun Anda berhasil dibuat... ");
window.location = "https://www.javatpoint.com/";
}
}
</script>
</body>
</html>
Dokumentasi
Comments
Post a Comment