1

I'm trying to create a contact form in Wordpress using wp_mail and ajax

The emial works but I'm having problems with the ajax success reponse.

After the email is sent I need to show the user a message that the email was sent.

The js to validate the form and show the succes message.

    $atj(function(){
      $atj('#training-submit').click(function(e) {
        e.preventDefault();
        e.stopPropagation();
        if(verfiyFields()) {
            alert('here');
            requestData = {
              'action' : 'myajax-submit',
              'firstName' : $atj("#name").val(), 
              'email' : $atj("#email").val(), 
          }
          $atj.post(MyAjax.ajaxurl, requestData).done(function(result){        
            result = jQuery.parseJSON( result );
            console.log(result);
            if(result == 'success'){
              $atj('.training-form [type=text]').val('');
              $atj('.training-form-message').append('<p class="training-form-complete-message">Thank you for the  email</p>');
            }
          });
        }
      });
    })



    //Verfiy 
    function verfiyTrainingFields() {
      var flag = true;

      var name =        $atj('#name');
      var email =       $atj('#email');

      if(name.val().indexOf(' ') === -1 ){
        name.parent().prepend('<p class="form-error">Please enter name, first space last</p>');
        errorMessage($atj('.form-error'));
        flag = false;
      }
      if(!IsEmail(email.val())){
        email.parent().prepend('<p class="form-error">Please enter valid email address</p>');
        errorMessage($atj('.form-error'));
        flag = false;
      }
      return flag;
    }

The functions.php file to send the email and send the ajax reponse.

    function myajax_submit() {

        $name = sanitize_text_field($_POST['firstName']);
        $email = sanitize_text_field($_POST['email']);

        $headers[] = 'From: ' . $name . ' <' . $email . '>' . "\r\n";
        $headers[] = 'Content-type: text/html' . "\r\n"; //Enables HTML ContentType. Remove it for Plain Text Messages

        $to = 'me@mysite.co.uk';

        $message = 'Name: ' . $name . "\r\n" . 'email: ' . $email;

        add_filter( 'wp_mail_content_type', 'set_html_content_type' );
        wp_mail( $to, 'Email Test', $message );
        remove_filter( 'wp_mail_content_type', 'set_html_content_type' ); 

        echo 'email sent';

        // generate the response
        $response = json_encode( array( 'success') );

        // response output
        header( "Content-Type: application/json" );
        echo $response;

        exit;
    }

The email is sent and the 'email sent' echo fires but the if(result == 'success'){ in the js doesn't work.

The console.log(result) in the js file gives the following.

    <br />
    <b>Warning</b>:  call_user_func_array() expects parameter 1 to be a valid callback, function 'set_html_content_type' not found or invalid function name in <b>/Users/user.name/Desktop/MAMP-DocRoot/appname/src/php/wp-includes/plugin.php</b> on line <b>192</b><br />
    email sent<br />
    <b>Warning</b>:  Cannot modify header information - headers already sent by (output started at /Users/user.name/Desktop/MAMP-DocRoot/appname/src/php/wp-includes/plugin.php:192) in <b>/Users/user.name/Desktop/MAMP-DocRoot/appname/src/php/wp-content/themes/sitename/functions.php</b> on line <b>66</b><br />
    ["success"] 
1

You can't use 2 echos for an ajax response.

Try this:

js:

  $atj.post(MyAjax.ajaxurl, requestData).done(function(result){        
    console.log(result);
    if(result == 'success'){
      $atj('.training-form [type=text]').val('');
      $atj('.training-form-message').append('<p class="training-form-complete-message">Thank you for the  email</p>');
    }
  });

php

function myajax_submit() {
// snip...

 $mail_check = wp_mail( $to, 'Email Test', $message );
 remove_filter( 'wp_mail_content_type', 'set_html_content_type' ); 

 if( $mail_check) 
   echo 'success';
 else
   echo 'failure';
 exit;
}
  • I see that user51442 has a history of not following up on Answers with questions or acceptance. – shanebp Oct 17 '14 at 21:28
  • shanebp - I do follow up on answers with questions and accepting but I still can't get it to work. Your answer might be correct but I can't get it to work so I can't accept it. i can't accept it because I have less then 15 reputations – user51442 Oct 18 '14 at 13:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.