2014-10-11 3 views
0

Я пытаюсь создать простую форму контакта с помощью jquery, чтобы проверить форму и ajax, чтобы передать ее php и WP wp_mail для ее отправки.Форма контакта Wordpress - ajax, wp_mail

У меня есть простая форма, подобная этому.

<form role="form"> 
     <div class="form-group"> 
      <label class="">Name</label> 
      <input type="text" id="name" class="form-control" name" /> 
     </div> 

     <div class="form-group"> 
      <label class="">Email</label> 
      <input type="text" id="email" class="form-control" name="email" /> 
     </div> 

     <?php wp_nonce_field('atex_php', 'atex_nonce'); ?> 

     <button class="submit">Submit</button> 

    </form> 

JQuery для проверки входов и отправить PHP

// IsEmail и FADEOUT функции не показаны

$atj(function(){ 
     $atj('submit').click(function(e) { 
     e.preventDefault(); 

     if(verfiyFields()) { 

      $atj.post({ 
      data : { 
       action : "request", 
       firstName : $atj("#name").val(), 
       email : $atj("#email").val(), 
      } 
      }) 
     } 
     }); 
    }) 

    //Verfiy 
    function verfiyFields() { 
     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>'); 
     fadeOut(); 
     flag = false; 
     } 
     if(!IsEmail(email.val())){ 
     email.parent().prepend('<p class="form-error">Please enter valid email address</p>'); 
     fadeOut(); 
     flag = false; 
     } 
     return flag; 
    } 

И PHP в function.php

add_action('wp_ajax_nopriv_request', 'my_action_callback'); 

    function my_action_callback() { 

     if (isset($_POST['atex_nonce']) && wp_verify_nonce($_POST['atex_nonce'], 'atex_php')) { 
      $name = $_POST['firstName']; 
      $email = $_POST['email']; 

      $send_to = [email protected]; 

      $subject = 'Request from'. $name; 

      $success = wp_mail($send_to, $subject, $message); 

      if($success){ 
       return true; 
      }else{ 
       return false; 
      } 

     } 
    } 

Я получаю 404 Not Found для [object% 20Object] на вкладке «Сеть» инструментов chrome dev, когда submit c лизнул.

Как я могу получить эту работу

+0

Любые причины не использовать плагин, например [Контактная форма 7] (https://wordpress.org/plugins/contact-form-7/) для этого? Он может обрабатывать все, что вы хотите выполнить. –

+0

Обращается ли контактная форма 7 с отправляемой почтой или она просто захватывает информацию. У меня есть несколько форм отправки электронных писем, некоторые из которых отправляют внутренние ответы. – ttmt

+0

Да, он обрабатывает отправку слишком –

ответ

1

вам нужно епдиеие несколько сценариев:

Допустим, вы сценарий проверки в файле с именем validationForm.js

function ajaxScript(){ 
    $params = array(
    'ajaxurl' => admin_url('admin-ajax.php') 
    ); 

    wp_enqueue_script('validation', get_template_directory_uri() . '/js/validationForm.js',  array(), '', true); 
    wp_localize_script('validation', 'ajax_object', $params); 
} 

add_action('wp_enqueue_scripts', 'ajaxScript'); 

Кроме того, необходимо добавьте этот крюк действия:

add_action('wp_ajax_amc_form_fr', 'my_action_callback'); 

Затем, используйте функцию ajax jquery для отправки fo:

var dataString = $(form).serialize(); 

jQuery.ajax({ 
    type: "POST", 
    url: ajax_object.ajaxurl, 
    dataType : 'JSON', 
     data : 'action=jQuery.ajax({ 
     type: "POST", 
     url: ajax_object.ajaxurl, 
     dataType : 'JSON', 
     data : 'action=amc_form_fr&'+dataString,&'+dataString, 

    success: function(response) { 
    console.log(response); 
    // your code 
    } 

Если им нехорошо, я думаю, что есть. And check this link

Смежные вопросы