Ajax post returning full html page as response
I know that this has been frequently asked here, but none of the solutions I find seem to work for me.
The issue is as follows: whenever I post the form, I have a console log with the response which is a full html page rather than a simple message.
Backend script:
add_action( 'admin_ajax_nopriv_email_verification_form', 'verify_and_sanitize_email_form' );
add_action( 'admin_ajax_email_verification_form', 'verify_and_sanitize_email_form' );
// Email verification callback
function verify_and_sanitize_email_form() {
// Check referer
check_ajax_referer( '9pU0Pk7T01', 'security' );
if(empty($_POST) || !isset($_POST['rguroo_email']) || !isset($_POST['rguroo_email_confirmation']) || !isset($_POST['rguroo_desired_action'])) {
echo 'There is one or more empty fields';
wp_die();
}
$sanitized_email = sanitize_email( esc_html($_POST['rguroo_email'] ));
$sanitized_email_confirmation = sanitize_email( esc_html($_POST['rguroo_email_confirmation'] ));
$desired_action = esc_html($_POST['rguroo_desired_action']);
if(!is_email( $sanitized_email ) || !is_email( $sanitized_email_confirmation )) {
echo 'Email is not valid';
wp_die();
}
if($sanitized_email !== $sanitized_email_confirmation) {
echo 'Emails do not match';
wp_die();
}
if($desired_action !== 'purchase' || $desired_action !== 'renewal' || $desired_action !== 'trial') {
echo 'Fatal error with radio buttons';
wp_die();
}
if(!isset($_COOKIE['rguroo_form_type'])) {
echo 'Server error';
wp_die();
}
// student email verification logic
$form_type = $_COOKIE['rguroo_form_type'];
if($form_type === 'student') {
$trail = substr($sanitized_email, -4);
if($trail !== '.edu') {
echo 'Not a valid student email';
wp_die();
}
// Other university specific logic here
}
setcookie('rguroo_form_action',$desired_action, 14 * DAY_IN_SECONDS);
setcookie('rguroo_form_email', $sanitized_email, 14 * DAY_IN_SECONDS);
echo "success";
wp_die();
}
Frontend javascript:
jQuery(document).ready(function () {
jQuery('form#email-verification').on( 'submit', function () {
var form_data = jQuery(this).serializeArray();
form_data.push( { "name" : "security", "value" : ajax_info.ajax_nonce } );
jQuery.ajax({
url : ajax_info.ajax_url,
type : 'post',
data : form_data,
success : function( response ) {
console.log(response);
if(response !== 'success') {
jQuery('.error').innerHTML = response;
} else {
location.reload();
}
},
fail : function( err ) {
jQuery('.error').innerHTML = "Cannot contact server";
}
});
return false;
});
});
Form (used in a shortcode):
function output_email_verification() {
return '<form action="'.esc_url( admin_url("admin-ajax.php") ).'" method="post" id="email-verification">
<p class="error">'.$error.'</p>
<input type="radio" label="Purchase 12 months access" value="purchase" name="rguroo_desired_action" checked>Purchase 12 months access</input>
<input type="radio" label="Renew account" name="rguroo_desired_action" value="renewal">Renew account</input>
<input type="radio" label="Create trial account" name="rguroo_desired_action" value="trial">Create trial account</input>
<p class="form-subtext">* indicates required field</p>
<p>Email address*</p>
<input type="text" name="rguroo_email" required>
<p>Re-type email address*</p>
<input type="text" name="rguroo_email_confirmation" required>
<input type="hidden" name="action" value="email_verification_form">
<input type="submit" value="Submit">
</form>';
}
Things I know: there isn’t an issue with jQuery sending the post (or at least making the post request). On submit jQuery sends the post with all of the correct parameters. I also know that I’m not using different nonces. I have tried placing error_logs() all around the callback function, but none of them ever got displayed in debug.log. This leads me to believe that the callback is never actually called, but I don’t know why. Also, even if I give the form a test which should fail, jQuery still reads it as a success.
I’ve wasted all day on this form and feel like an idiot. Could someone with a few more braincells than me please tell me where I’m going wrong?
Thank you so much.
Leave an answer