Ik probeer via Jquery validation een geboorte datum te valideren. Dit werkt goed tot dat ik een stukje script toepas om een V (goed) teken te krijgen. Dan werkt ineens de groups functie niet meer.
<!DOCTYPE html>
<html lang="nl-NL">
<head>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.17.0/jquery.validate.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.17.0/additional-methods.min.js"></script>
<script src="/js/test_datum1.js"></script>
</head>
<body>
<form action="" name="registratieformulier" method="post" id="register_form">
<fieldset>
<label for="leeftijd">Geboorte datum:*</label>
<select id="dagen" name="dagen" class="leeftijd">
<option value="">Dag</option><option value="1">1</option><option value="2">2</option>
</select>
<select id="maanden" name="maanden" class="leeftijd">
<option value="">Maand</option><option value="January">januari</option><option value="February">februari</option>
</select>
<select id="jaren" name="jaren" class="leeftijd">
<option value="">Jaar</option><option value="2018">2018</option><option value="2017">2017</option>
</select>
</fieldset>
<fieldset>
<button type="submit" name="register" class="b_verzenden" value="verzenden">Verzenden</button>
</fieldset>
</form>
</body>
</html>
$().ready(function() {
$("#register_form").validate({
onkeyup: false, // Valideren werkt pas na de tab ipv bij elke toetsaanslag
groups: {
nameGroup: "dagen maanden jaren"
},
rules: {
firstname: {
required: true,
},
dagen: {
required: true,
},
maanden: {
required: true,
},
jaren: {
required: true,
},
},
messages: {
dagen: {
required: 'Vul de volledige geboorte datum in.',
},
maanden: {
required: 'Vul de volledige geboorte datum in.',
},
jaren: {
required: 'Vul de volledige geboorte datum in.',
}
},
});
});
Bij bovenstaande werkt het gewoon goed. Maar voeg ik dit stukje toe dan werkt het bij alle overige velden goed alleen bij de datum niet dan komt er een V'tje bij elke select ipv alleen bij de groep.
$().ready(function() {
$("#register_form").validate({
onkeyup: false, // Valideren werkt pas na de tab ipv bij elke toetsaanslag
groups: {
nameGroup: "dagen maanden jaren"
},
rules: {
firstname: {
required: true,
},
dagen: {
required: true,
},
maanden: {
required: true,
},
jaren: {
required: true,
},
},
messages: {
dagen: {
required: 'Vul de volledige geboorte datum in.',
},
maanden: {
required: 'Vul de volledige geboorte datum in.',
},
jaren: {
required: 'Vul de volledige geboorte datum in.',
}
},
success: function (element) {
element.text('✓').addClass('valid')
.closest('.register_form').removeClass('error').addClass('success');
}
});
});
