【问题标题】：JQuery Ajax send data from Contact Form 7 Multi-Step Form WordpressJQuery Ajax 从 Contact Form 7 Multi-Step Form Wordpress 发送数据
【发布时间】：2018-11-09 03:52:47
【问题描述】：

我想在 php 文件中从 Contact Form 7 Multi-Step Form 发送数据。每一步都有1-4个字段。所以我希望通过电子邮件发送的相同数据也发送到 php 文件。发送到电子邮件的数据如下：

Internet: [radio-internet]
Mobile: [radio-mobile]
Provider: [radio-provider]
Surname: [your-surname]
Name: [your-name]
Email: [your-email]
Phone: [your-phone]
Hours: [radio-hours]

我已经尝试过类似的方法但不起作用：

<script type="text/javascript">
document.addEventListener( 'wpcf7submit', function( event ) {
    //Form
    var inputs = event.detail.inputs;

    for ( var i = 0; i < inputs.length; i++ ) {
    if ( 'radio-internet' == inputs[i].name &&  'radio-mobile' == inputs[i].name &&  && 'radio-provider' == inputs[i].name && 'your-surname' == inputs[i].name &&  'your-name' == inputs[i].name  &&  'your-email' == inputs[i].name  &&  'your-phone' == inputs[i].name  &&  'radio-hours' == inputs[i].name ) {
        jQuery.ajax({
            url  : 'process.php', // the url where we want to POST 
            type : 'post',
            data :  inputs,
            success : function( response ){
                console.log(response);
                console.log('lead inserted');
            },
            error : function(e1, e2, e3){
                console.log(e1);
                console.log(e2);
                console.log(e3);
            }
        });
        console.log( event.detail );
    }

}, false );
</script>

注意：每个字段必须转到php文件中的不同字段

$data = array(
"lastname" => "" . $_POST['surname'], //surname
"firstname" => "" . $_POST['name'], //name
"mobile" => "" . $_POST['phone'], //mobile
"email" => "" . $_POST['email'], //email
);

【问题讨论】：

你想对这些数据做什么？因为联系表格 7 有一些过滤器，您可以使用这些过滤器做很多事情。那么告诉我你想要在php文件中的用途是什么？
我希望这些数据在最后一次提交按钮上自动发送到 vtiger crm 中。

标签： php jquery ajax wordpress contact-form-7

【解决方案1】：

尝试使用 'wpcf7mailsent' 事件，它对我有用。

document.addEventListener( 'wpcf7mailsent', function( event ) {
    
            var inputs = event.detail.inputs;
    
            
                var username = document.getElementById('username').value; // OR jQuery( "#username" ).val();

                var email = document.getElementById('email').value; // OR jQuery( "#email" ).val();
                
    
                jQuery.ajax({
                   url  : <?php echo admin_url('admin-ajax.php'); ?>, // the url where we want to POST 
                type : 'post',
                data :  {action:second_form,username:username,email:email},
                success : function( response ){
                    console.log(response);
                    
                },
                  error: function(response) {
                    console.log(response);
                  },
                });
                alert('hi');
            
    
        }, false );

Ajax 动作函数

add_action('wp_ajax_second_form' , 'second_form');
add_action('wp_ajax_nopriv_second_form','second_form');
function second_form(){
echo $_POST['username'];
echo $_POST['email'];
//do for second form
}

【讨论】：

联系表格 id 123 是最后一个表格吗？由于我使用 Contact Form 7 Multi-Step Form，如何从所有表单中读取数据。
去掉 if 条件，只是例子
我收到一个错误：(index):383 Uncaught TypeError: Cannot read property 'value' of null。第383章所以无法读取其他表单的数据？
它对我不起作用...如何从其他表单保存数据并将所有数据发送到我们要发布数据的 url 之后？在每个步骤中使用您的解决方案，当我单击每个表单的提交按钮时，我看到在每个表单中发送数据

【解决方案2】：

为此，您可以在电子邮件发送挂钩之前使用联系表 7。

现在我只是将数据存储在一个文本文件中，您可以在此处添加逻辑。

 add_action( 'wpcf7_before_send_mail', 'd_before_send_email' );

 function d_before_send_email($cf7) {
    $output = "";
    $output .= "Name: " . $_POST['name'];
    $output .= "Email: " . $_POST['email'];       

    file_put_contents("contactform7output.txt", $output);
   }

【讨论】：