I have a HTML5 form with required attributes on my input field. I want to validate the required attribute before i submit the form in the JS. I have made a script but it is not working. Can anyone see my mistake? Currently it is not submiting the data to my php file. If i remove the lines
var validator = $("#myForm").validate(options);
if (validator.form()) { ... }
the submit works but the validation is not done. It would submit also emtpy data.
FORM
<form id="myForm" method="post">
<input type="week" name="audit_req_date" required>
<button type="submit" id="submitFormData" onclick="SubmitFormData();">Submit</button>
</form>JS
<script>
function SubmitFormData() {
var validator = $("#myForm").validate(options);
if (validator.form()) {
// submit with AJAX
var formValues = $('#myForm').serialize();
$.post("<?= $base ?>beta/assets/ajax/ajax_query.php", formValues,
function(data) {
$('#results').html(data);
}
);
}
}
</script>