I\'m trying to use the jquery validate plugin to validate a form and submit the contents with an ajax request.
This code is in the head of my document.
I'm guessing you don't have a jquery form plugin included. ajaxSubmit
isn't a core jquery function, I believe.
Something like this : http://jquery.malsup.com/form/
UPD
<script src="http://malsup.github.com/jquery.form.js"></script>
this is new function so you have to add other lib file after jQuery lib
<script src="http://malsup.github.com/jquery.form.js"></script>
it will work.. I have tested.. hope it will work for you..
Try ajaxsubmit library. It does ajax submition as well as validation via ajax.
Also configuration is very flexible to support any kind of UI.
Live demo available with js, css and html examples.
$(form).ajaxSubmit();
triggers another validation resulting to a recursion. try changing it to
form.ajaxSubmit();
Ajax Submit form with out page refresh by using jquery ajax method first include library jquery.js and jquery-form.js then create form in html:
<form action="postpage.php" method="POST" id="postForm" >
<div id="flash_success"></div>
name:
<input type="text" name="name" />
password:
<input type="password" name="pass" />
Email:
<input type="text" name="email" />
<input type="submit" name="btn" value="Submit" />
</form>
<script>
var options = {
target: '#flash_success', // your response show in this ID
beforeSubmit: callValidationFunction,
success: YourResponseFunction
};
// bind to the form's submit event
jQuery('#postForm').submit(function() {
jQuery(this).ajaxSubmit(options);
return false;
});
});
function callValidationFunction()
{
// validation code for your form HERE
}
function YourResponseFunction(responseText, statusText, xhr, $form)
{
if(responseText=='success')
{
$('#flash_success').html('Your Success Message Here!!!');
$('body,html').animate({scrollTop: 0}, 800);
}else
{
$('#flash_success').html('Error Msg Here');
}
}
</script>
Drupal 8
Drupal 8 does not include JS-libraries to pages automaticly. So most probably if you meet this error you need to attach 'core/jquery.form' library to your page (or form). Add something like this to your render array:
$form['#attached']['library'][] = 'core/jquery.form';