I want to implement a check function, that checks if the input fields are empty - if empty, the send button should be disabled. i used the addEventListener method.
When i debug it, the else statement is triggering, but it returns true and i don't know why.
here's the code:
//all the form fields saved as variables
const form = document.getElementById("form");
const name = document.getElementById("name");
const email = document.getElementById("email");
const text = document.getElementById("text");
const button = document.getElementById("button");
form.addEventListener("change", buttoActivationCheck());
//custom functions
function buttoActivationCheck() {
const nameValueForButton = name.value.trim();
const textValueForButton = text.value.trim();
const emailValueForButton = email.value.trim();
if (nameValueForButton === "") {
button.disabled = true;
}
if (emailValueForButton === "") {
button.disabled = true;
}
if (textValueForButton === "") {
button.disabled = true;
}
else {
button.disabled = false;
}
}
Probably you no need else
at all.
function buttoActivationCheck() {
const nameValueForButton = name.value.trim();
const textValueForButton = text.value.trim();
const emailValueForButton = email.value.trim();
button.disabled = false;
if (nameValueForButton === "" ||
emailValueForButton === "" ||
textValueForButton === "") button.disabled = true;
}
Or just:
function buttoActivationCheck() {
button.disabled = !Boolean(name.value.trim() && text.value.trim() && email.value.trim());
}
Button is false if every of the values is true.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.