-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
58 lines (53 loc) · 2.05 KB
/
script.js
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
// sign in
const form = document.querySelector(".form-wrapper");
const email = document.querySelector("#email");
const emailError = document.querySelector("#emailError");
const password = document.querySelector("#password");
const passwordConfirmation = document.querySelector("#passwordConfirmation");
const passwordError = document.querySelector("#passwordError");
passwordConfirmation.addEventListener("input", (event) => {
console.log("password");
if (password.value !== passwordConfirmation.value) {
passwordError.textContent = "Passwords need to be identical";
passwordError.className = "error active";
} else if (password.validity.tooShort) {
passwordError.textContent = `Password should be at least ${password.minLength} characters; you entered ${password.value.length}.`;
passwordError.className = "error active";
} else if (password.validity.valid) {
passwordError.textContent = "";
passwordError.className = "error";
}
});
email.addEventListener("input", (event) => {
//check validity of email
if (email.validity.valid) {
emailError.textContent = "";
emailError.className = "error";
} else {
showError(email, emailError);
}
});
form.addEventListener("submit", (event) => {
// if the email field is valid, we let the form submit
if (
!email.validity.valid ||
!password.validity.valid
) {
// If it isn't, we display an appropriate error message
showError();
// Then we prevent the form from being sent by canceling the event
event.preventDefault();
window.location.href = 'mybooks.html'
}
});
function showError(input, inputError) {
console.log(input);
if (input.validity.valueMissing) {
inputError.textContent = "You need to enter an email address.";
} else if (input.validity.typeMismatch) {
inputError.textContent = "Entered value needs to be an email address.";
} else if (input.validity.tooShort) {
inputError.textContent = `Email should be at least ${email.minLength} characters; you entered ${email.value.length}.`;
inputError.className = "error active";
}
}