Reply To: Frontend form – post via ajax?

• robruifrok

• October 4, 2019 at 8:13 pm

In input.js the function acf.validateForm(args) is defined.
This function can be used to trigger the validation of a frontend form.
You can set args the following way:

const args = {
form: $form //required. The form you are submitting

//the following default values ar set in validate:function(args) :

// trigger event
event: false,
		
// reset the form after submit
reset: false,
				
// loading callback
loading: function(){},
				
// complete callback
complete: function(){},
				
// failure callback
failure: function(){},
				
// success callback
success: function( $form ){
   $form.submit();
   }
}

The default success callback starts submission when validation is is successful.
You can replace this function by any other function.

So you can block the validation and submission and call acf.validateForm:

$('.cursus-info').on('click','.acf-button',function() {

$('form#acf-form').on('submit',function(event){
event.preventDefault();
});

args= {
form: $form,
reset: true
success: function($form) {

//Your ajax code or what ever you want to do

}

}

acf.validateForm(args);
	
}

In addition to submitting by ajax using acf.validateForm offers many other possibilities like validating without submisssion, do things when validation fails by defining the failure callback etc.