在wordpress中添加联系人表单ajax与短代码

Question

我使用ajax为我的联系表单创建了一个插件，并添加了短代码wordpress。我没有得到如何做到这一点，它的工作是完美的，并阅读了几个关于admin- ajax.php的论坛，但不知道如何将数据传递给这个文件。

这是代码：

<?php 

/* 
Plugin Name: Formulario de contacto 
Plugin URI: http://www.e-world.co 
Description: Formulario de contacto con ajax 
Version: 1.0 
Author: Jorge Moreno 
Author URI: http://www.e-world.co 
license: GLP2 
*/ 

function the_action_function(){ 
    $adminemail = "jorge.moreno@e-world.co"; 

           if ($_GET['send'] == 'comments') 
           { 

            $_uname = $_POST['name']; 
            $_uemail = $_POST['email']; 

            $_website = $_POST['website']; 
            $_comments = stripslashes($_POST['comment']); 



            $email_check = ''; 
            $return_arr = array(); 

            if($_uname=="" || $_uemail=="" || $_comments=="") 
            { 
             $return_arr["frm_check"] = 'error'; 
             $return_arr["msg"] = "Please fill in all required fields!"; 
            } 
            else if(filter_var($_uemail, FILTER_VALIDATE_EMAIL)) 
            { 

            $to = $adminemail; 
            $from = $_uemail; 
            $subject = "Renew Email: " .$_uname; 

            $message = 'Name: &nbsp;&nbsp;' . $_uname . '<br><br> Email: &nbsp;&nbsp;' . $_uemail . '<br><br> website: &nbsp;&nbsp;' . $_website . '<br><br> Comment:&nbsp;&nbsp;' . $_comments; 

            $headers = "MIME-Version: 1.0\r\n"; 
            $headers .= "Content-type: text/html; charset=iso-8859-1\r\n"; 
            $headers .= "Content-Transfer-Encoding: 7bit\r\n"; 
            $headers .= "From: " . $from . "\r\n"; 

            @mail($to, $subject, $message, $headers); 

            } else { 


            $return_arr["frm_check"] = 'error'; 
            $return_arr["msg"] = "Please enter a valid email address!"; 


           } 

           echo json_encode($return_arr); 
           } 
} 

function createAjaxContactForm() { 
    return ' 
         <div class="form"> 
          <form action="process.php" method="post" name="ContactForm" id="ContactForm" > 
           <div class="form-group">  
            <input type="text" class="form-control" name="name" placeholder="Full Name *"> 
           </div> 
           <div class="form-group">  
            <input type="text" class="form-control" name="email" placeholder="Email *"> 
           </div> 
           <div class="form-group">  
            <input type="text" class="form-control" name="website" placeholder="Website"> 
           </div> 
           <div class="form-group"> 
            <textarea rows="5" class="form-control" name="comment" placeholder="Your Message *" style="height:175px;"></textarea> 
           </div> 
           <div id="message_post"></div> 
           <input class="btn btn-default" type="submit" value="ENVIAR" name="submitf" id="submitf"> 
          </form> 
         </div>'; 
} 

add_shortcode('AjaxContactForm', 'createAjaxContactForm'); 

?> 

和我的ajax：

jQuery(function(){ 
    jQuery("#ContactForm").submit(function(){ 
     jQuery("#submitf").value='Please wait...'; 

     jQuery.post("password/wp-admin/admin-ajax.php", jQuery("#ContactForm").serialize(), 
     function(data){ 
      if(data.frm_check == 'error'){ 

        jQuery("#message_post").html("<div class='errorMessage'>ERROR: " + data.msg + "!</div>"); 
        document.ContactForm.submitf.value='Resend >>'; 
        document.ContactForm.submitf.disabled=false; 
      } else { 
       jQuery("#message_post").html("<div class='successMessage'>Your message has been sent successfully!</div>"); 
       jQuery("#submitf").value='Send >>'; 
       } 
     }, "json"); 

     return false; 

    }); 
}); 

Answer 1

这是ajaxurl写代码的主题/ functions.php中

<?php function frontend_custom_ajaxurl() { ?> 
    <script type="text/javascript"> 
     var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>'; 
    </script> 
    <?php 
    } 
add_action('wp_head','frontend_custom_ajaxurl'); 

这是你的PHP函数可以做任何事情。并且将这些代码写入你的主题/ functions.php文件

function your_function() { 
    parse_str($_POST['data'], $params); 
    print_r($params) 
    exit; 
} 
add_action('wp_ajax_your_function', 'your_function'); 
add_action('wp_ajax_nopriv_your_function', 'your_function'); 

这是JQuery。

jQuery("#ContactForm").submit(function(event) { 
    event.preventDefault(); 
    jQuery("#submitf").value = 'Please wait...'; 
    var data = { 
     action: 'your_function', // here php function such as your_function 
     data: jQuery("#ContactForm").serialize(), 
    }; 
    jQuery.post(ajaxurl, data, function(response) { 
     ...................... 
    }); 
}); 

任何混淆评论？

Answer 2

对Ajax使用此代码：

使用下面的代码以.php文件并用jQuery替换$，如果它不起作用

$().ready(function() { 
    var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>"; 
    $.post(
     ajaxurl, { 
      'action': 'set_the_city', 
      //pass all the parameter from the form in key value pairs here 
     }, 
     function(output) { 
      console.log(output) 
     }); 
}); 

WordPress为ajax调用的使用提供了一个钩子代替。

add_action('wp_ajax_set_the_city', 'set_the_city'); 
add_action('wp_ajax_nopriv_set_the_city', 'set_the_city'); 

function set_the_city() { 
    //all the data can be retrieved by $_REQUEST so do the coding for the_action_function() here. 
}