When I fill in all the input fields and choose an option in the select dropdown, for some reason the class will not be removed unless I start with the select dropdown. How come is that? I really don't get it.
Here's my JavaScript:
function checkForInput() {
var copyButton = document.getElementById('copyButton');
var inputFields = firstNameInput.value && lastNameInput.value && emailInput.value && jobTitleInput.value && departmentSelect.options[departmentSelect.selectedIndex].value;
if(inputFields != '') {
copyButton.classList.remove('disabled');
} else {
copyButton.classList.add('disabled');
}
}
And my HTML:
<div class="container">
<div class="row">
<form class="col s12">
<div class="row">
<div class="input-field col m6 s12">
<input id="first_name_input" type="text" class="validate" onkeyup="firstNamePrev(); checkForInput();">
<label for="first_name">Fornavn</label>
</div>
<div class="input-field col m6 s12">
<input id="last_name_input" type="text" class="validate" onkeyup="lastNamePrev(); checkForInput();">
<label for="last_name">Efternavn</label>
</div>
</div>
<div class="row">
<div class="input-field col m4 s12">
<input id="email_input" type="email" class="validate" onkeyup="emailPrev(); checkForInput();">
<label for="email">Email</label>
</div>
<div class="input-field col m4 s12">
<input id="job_title_input" type="text" class="validate" onkeyup="jobTitlePrev(); checkForInput();">
<label for="job_title">Jobtitel</label>
</div>
<div class="input-field col m4 s12">
<select id="department_select" onchange="departmentPrev();" onkeyup="checkForInput();">
<option value="" disabled selected>Afdeling</option>
<option value="administration">Administration</option>
<option value="marketing">Marketing</option>
<option value="support">Support</option>
<option value="reklamation">Reklamation</option>
<option value="produktion">Produktion</option>
</select>
</div>
</div>
</form>
</div>
Aucun commentaire:
Enregistrer un commentaire