Submitting a Form via AJAX

To submit a Sprout Form via AJAX, you can do so just as you would any other form.

Display your form on the page:

{{ craft.sproutForms.displayForm('contact') }} 

We'll use JQuery in our example.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> <script type="text/javascript"> 	 	// watch the form submit event 	$('#contact-form').submit(function(event) {  		event.preventDefault();      		// prepare some variables 		var postUrl = 'sprout-forms/entries/save-entry'; 		var formData = $(this).serialize();  		// process the form 		$.ajax({ 			type : 'POST', 			url : postUrl, 			data : formData, 			dataType : 'json', 			encode : true 		}) 		.done(function(data) {  			// Sprout Forms will give you back a success or error response in JSON 			if (data.success == true) 			{ 				console.log('success'); 				console.log(data);  				// RESPONSE 				// {success: true}  				// var redirect = $('#contact-form input[name=redirect]').val(); 				// $(location).attr('href', redirect); 			} 			else 			{ 				console.log('error'); 				console.log(data);  				// REPONSE  				// "errors": { 				// 	"fieldHandle": { 				// 		"message": "Error message" 				// 	} 				// } 			} 		}); 	}); </script> 

Note: This behavior may require some knowledge of javascript to implement.