Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Kelvin Atawura
Front End Web Development Techdegree Student 19,022 Pointsajax form submission in wordpress
l got the code below handling form submission in WordPress. The form sends but for some reason l get the error response back instead of the success response. is there anything that am doing wrong with this code?
$(function(){
$("#contact-form").validate({
errorElement: 'span',
submitHandler: function(form) {
var _data = { 'nonce' : '<?php echo wp_create_nonce( "ajax_post_author_credit_nonce" ); ?>', 'action' : 'contact_enquiry' }
$(form).ajaxSubmit({
dataType: 'json',
data: _data,
beforeSubmit: function(arr, $form, options) {
var name = $('#contact-form input[name="name"]').fieldValue();
var phone = $('#contact-form input[name="telephone"]').fieldValue();
var email = $('#contact-form input[name="email"]').fieldValue();
var company = $('#contact-form input[name="company"]').fieldValue();
var enquiry = $('#contact-form textarea').fieldValue();
},
success: function(resp){
console.log('sucess');
setTimeout(function(){
$('.row-offcanvas .sidebar-offcanvas .btn-contact').click();
}, 1000);
},
error: function(resp){
alert('Sorry there was an error with your submission. Please try again later.');
console.log(resp);
}
});
}
});
});
2 Answers
Iain Simmons
Treehouse Moderator 32,305 Pointsvalidate and ajaxSubmit aren't normal jQuery methods... if you're using an additional plugin, please let us know what it is and share a link to it or its documentation, and also for your own code, make sure the plugin JS is being included and run before this code.
Iain Simmons
Treehouse Moderator 32,305 PointsOkay so I don't know if I'm looking at the same plugins but jQuery Validate looks like it binds an event to run when a form is submitted.
Your ajaxSubmit method is being called from within the validate method... So it will only run when the form is submitted in the regular way (via the built in HTML form handling). Try take that out, and instead add to a regular jQuery submit method on the form element.
Validate takes an option sendForm that if set to false, will stop the HTML form handling (so you can do it with Ajax).
I don't see any options in Validate for errorElement or submitHandler...
Kelvin Atawura
Front End Web Development Techdegree Student 19,022 PointsKelvin Atawura
Front End Web Development Techdegree Student 19,022 PointsSorry l forgot to add those. l am using the jQuery Form Plugin and jQuery Validate.