I'm a novice coder, and i'm having trouble putting a simple form together using validator.js
Basically since trying to build in the validation the form has stopped working, my guess is the 'data: $('#send-form').serialize(),' has not got the correct path or syntax, but i could be wrong.
As soon as i add:
$.ajax({
type: "POST",
url: "process.php",
data: $('#send-form').serialize(),
}
the alerts do not fire!
<form class="contact" name="contact" id="send-form" data-toggle="validator" role="form" >
<div class="form-group">
<label class="subTitle" for="name">NAME</label><br>
<input type="text" name="name" class="form-control" placeholder="Enter your full name" data-error="Please enter your name" required>
<div class="help-block with-errors"></div><br>
</div>
<div class="form-group">
<label class="subTitle" for="email">E-MAIL</label><br>
<input type="email" name="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" class="form-control" placeholder="Enter a valid email address" data-error="Invalid email address" required>
<div class="help-block with-errors"></div><br>
</div>
<div class="form-group">
<button type="submit" class="subBtn form-control">SUBMIT YOUR ENQUIRY</button>
</div>
</form>
<script>
$('#send-form').validator().on('submit', function (e) {
if (e.isDefaultPrevented()) {
alert('form is not valid');
} else {
// everything looks good!
e.preventDefault();
alert('form is valid');
// your ajax
$.ajax({
type: "POST",
url: "process.php",
data: $('#send-form').serialize(),
}
});
</script></div>
Should be:
$('#send-form').validator().on('submit', function (e) {
if (e.isDefaultPrevented()) {
alert('form is not valid');
} else {
// everything looks good!
e.preventDefault();
alert('form is valid');
// your ajax
$.ajax({
type: "POST",
url: "process.php",
data: $('#send-form').serialize(),
});
}
});
(untested)