Obj/contact us updates#1
Conversation
| ); | ||
|
|
||
| radioButtonsEmailSpecification.forEach((radioButtonEmailSpecification) => { | ||
| if (clickedRadioButtonTelEmail.id == "email") { |
There was a problem hiding this comment.
Used strict equality (===) instead of loose equality (==) for comparison to ensure consistent behavior.
| isInputValid = TelRegEx.test(input.value); | ||
| break; | ||
| case "select-one": | ||
| isInputValid = input.value !== ""; |
There was a problem hiding this comment.
Used strict equality (===) instead of loose equality (==) for comparison to ensure consistent behavior.
| if (!isFormValid) return; | ||
|
|
||
| const inputsText = inputs | ||
| .filter((input) => input.value !== "on") |
There was a problem hiding this comment.
Used strict equality (===) instead of loose equality (==) for comparison to ensure consistent behavior.
| if (clickedRadioButtonTelEmail.id == "email") { | ||
| radioButtonEmailSpecification.parentElement.classList.remove("hidden"); | ||
| } else { | ||
| radioButtonEmailSpecification.parentElement.classList = "hidden"; |
There was a problem hiding this comment.
Replaced classList = with classList.add and classList.remove to correctly add or remove classes.
| messageTextInput.classList.remove("hidden"); | ||
| } else { | ||
| messageTextInput.value = ""; | ||
| messageTextInput.classList = "hidden"; |
There was a problem hiding this comment.
Replaced classList = with classList.add and classList.remove to correctly add or remove classes.
|
|
||
| if (isInputValid) input.classList.remove("invalid"); | ||
| else input.classList.add("invalid"); | ||
| return isInputValid; |
There was a problem hiding this comment.
Refactor to:
if (isInputValid) {
input.classList.remove("invalid");
} else {
input.classList.add("invalid");
}
return isInputValid;
| ); | ||
| const dropdown = document.querySelector("select"); | ||
|
|
||
| window.addEventListener("load", function () { |
There was a problem hiding this comment.
I would be better to refactor the code:
// Function to reset and add event listeners to text inputs and buttons
function initializeInputs() {
const textInputs = document.querySelectorAll(
'select, input:not([type="checkbox"]):not([type="radio"]):not(.notRequired)'
);
const buttons = document.querySelectorAll(
'input[type="checkbox"], input[type="radio"]:not(.notRequired)'
);
textInputs.forEach((textInput) => {
textInput.value = "";
textInput.addEventListener("input", (e) => validateInput(e.target));
});
buttons.forEach((button) => {
button.checked = false;
button.addEventListener("click", (e) => validateInput(e.target));
});
messageCheckBox.checked = false;
}
// Event listener for window load
window.addEventListener("load", function () {
initializeInputs();
});
| 'select,input:not(:is([type="checkbox"],[type="radio"]),.notRequired)' | ||
| ); | ||
| let buttons = document.querySelectorAll( | ||
| 'input:is([type="checkbox"],[type="radio"]):not(.notRequired)' |
There was a problem hiding this comment.
Simplified the selectors for text inputs and buttons to exclude the unnecessary :is and :not pseudo-classes.
| ); | ||
| let isFormValid = true; | ||
|
|
||
| for (const input of inputs) { |
There was a problem hiding this comment.
Used inputs.forEach instead of for...of loop in the validateForm function for consistency.
Refactor:
inputs.forEach((input) => {
if (!validateInput(input)) {
isFormValid = false;
}
});
if (!isFormValid) {
return;
}
| grid-column: 1/-1; | ||
| } | ||
|
|
||
| input, |
There was a problem hiding this comment.
SASS nesting - Refactor code: From the HTML structure input in nested within fieldset. Please refactor the code and follow the SASS nesting rules.
2 participants
No description provided.