You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="style.css">
|
|
|
|
|
<link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet">
|
|
|
|
|
<title>Homework #3 Prokhorova Anna</title>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<form action="" method="post" name="test" id="form">
|
|
|
|
|
<h1>Registration form</h1>
|
|
|
|
|
<label>
|
|
|
|
|
<input onchange="validation()" type="text" name="email" placeholder="Email" id="email">
|
|
|
|
|
<div class="invalid-input" id="email_inv"></div>
|
|
|
|
|
</label>
|
|
|
|
|
<br>
|
|
|
|
|
<label>
|
|
|
|
|
<input type="password" name="password" placeholder="Password">
|
|
|
|
|
</label>
|
|
|
|
|
<br>
|
|
|
|
|
<label>
|
|
|
|
|
<input type="password" name="confirmation" placeholder="Confirm password">
|
|
|
|
|
</label>
|
|
|
|
|
<br>
|
|
|
|
|
<div>
|
|
|
|
|
<input onclick="entrance()" type="button" name="submit" value="Register">
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
var error = false;
|
|
|
|
|
function validation() {
|
|
|
|
|
let email = form.email.value;
|
|
|
|
|
let email_inv = document.getElementById("email_inv");
|
|
|
|
|
let pattern = /(@)/;
|
|
|
|
|
if(!pattern.test(email)) {
|
|
|
|
|
error = "Your email isn't valid";
|
|
|
|
|
email_inv.innerHTML = `<span>${error}</span>`;
|
|
|
|
|
document.getElementById("email").style.border = "1px solid red";
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
document.getElementById("email_inv").innerHTML = " ";
|
|
|
|
|
document.getElementById("email").style.border = "1px solid grey";
|
|
|
|
|
error = false;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
function entrance() {
|
|
|
|
|
if(!error)
|
|
|
|
|
document.location.reload(true);
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
