在Wordpress中添加带有简码的联系人表单ajax [英] Add Contact form ajax with shortcode in wordpress

问题描述

我正在使用ajax为我的联系表单创建一个插件，并添加简码wordpress.我不知道如何做到这一点，它工作得很好，并且阅读了一些有关admin-ajax.php的论坛，但不了解如何将数据传递到此文件.

I'm creating a plugin for my contact form using ajax and add shortcode wordpress . I don't get how to do it and it work perfect, and read several forums about the admin- ajax.php but do not understand how to pass data to this file.

这是代码:

<?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 = "[e-mail]";

                                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;

    });
});

推荐答案

这是ajaxurl将此代码编写为your-theme/functions.php

This is ajaxurl write this code your-theme/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函数可以执行的任何操作.并将这段代码写在your-theme/functions.php文件中

This is your php function can do anything. And also write this code in your-theme/functions.php file

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) {
        ......................
    });
});

有任何混乱的评论吗?

这篇关于在Wordpress中添加带有简码的联系人表单ajax的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！