Question

我使用jQuery serizalize函数将表单数据发布到PHP脚本。

我的脚本运行正常并且PHP正在执行，尽管我没有从PHP中的表单中收到已发布的值。

这是我的代码

HTML：

<form id="contact_form" action="process.php" method="POST">
                        <div id="name-group" class="form-group">
                            <label for="name">Name</label>
                            <input type="text" class="form-control" name="name" placeholder="Ringo Starr" form="contact_form">
                        </div>
                        <div id="email-group" class="form-group">
                            <label for="email">Email</label>
                            <input type="text" class="form-control" name="email" placeholder="john@beatles.com" form="contact_form">
                        </div>
                        <div id="email-group" class="form-group">
                            <label for="message">Message</label>
                            <textarea rows="4" class="form-control" id="formMessageArea" name="message" placeholder="Your message here..." form="contact_form"></textarea>
                            <span class="countdown"></span>
                        </div>
                        <div class="result"></div>
                        <button id="submitButton" type="submit" class="btn btn-success">Submit</button>
                    </form>

Ajax Post：

$.ajax({
        url: $form.attr('action'),
        type: 'POST',
        datatype : 'html',
        data: data,
        success: function(response) {
            if (response.status === "success") {
                $('.result').text("Success!!");
            } else if (response.status === "error") {
                $('.result').text("Error!!");
            }
        }
    });

序列化数据：

name=Jamie+Berke&email=jamie_b25%40hotmail.com&message=testing+123

这是我的PHP：

<?php
$autoResponse = true; //if set to true auto response email will be sent, if you don't want autoresponse set it to false
$autoResponseSubject = "Demo Contact Form"; 
$autoResponseMessage = "Hi, thank you testing the JQuery Contact Form Demo.";
$autoResponseHeaders = "From: email_from@yourWebsite.com";  

//we need to get our variables first
$email_to =   'jamie_b25@hotmail.com';
$subject  =   'A enquiry for The Retros!';
$name     =   $_POST['name'];
$email    =   $_POST['email'];
$message  =   $_POST['message'];

$body = "From: $name \r\nMessage: \r\n$message";

$headers  = "From: $email\r\n";
$headers .= "CC: test@test.com\r\n";
$headers .= "Reply-To: $email\r\n";


if(mail($email_to, $subject, $body, $headers)){
    if($autoResponse === true){
        mail($email, $autoResponseSubject, $autoResponseMessage, $autoResponseHeaders);
    }
    echo 'success'; 
}else{
    echo 'error';/
}

＆GT;

以下是我的PHP返回的错误：

注意：未定义的索引：第10行的C：\ Users \ Jberke \ Documents \ Projects \ theRetros \ src \ process.php中的名称

调用堆栈：       0.0010 235032 1. {main}（）C：\ Users \ Jberke \ Documents \ Projects \ theRetros \ src \ process.php：0

注意：未定义的索引：第11行的C：\ Users \ Jberke \ Documents \ Projects \ theRetros \ src \ process.php中的电子邮件

调用堆栈：       0.0010 235032 1. {main}（）C：\ Users \ Jberke \ Documents \ Projects \ theRetros \ src \ process.php：0

注意：第12行的C：\ Users \ Jberke \ Documents \ Projects \ theRetros \ src \ process.php中的未定义索引：消息

调用堆栈：       0.0010 235032 1. {main}（）C：\ Users \ Jberke \ Documents \ Projects \ theRetros \ src \ process.php：0

如果我在PHP块周围添加if ( isset( $_POST['submit'] ) ) { }，则没有任何内容返回到jQuery-ajax成功函数，并且我的表单不会返回任何结果，尽管脚本似乎执行正常。

Answer 1

        <script>
                $('#submitButton').click(function(){
                    var data = $('#contact_form').serialize(); 
                        $.ajax({
                        url: $('#contact_form').attr('action'),
                        type: 'POST',
                        datatype : 'html',
                        data: data,
                        success: function(response) {
                            console.log(response);
                            if (response.status === "success") {
                                $('.result').text("Success!!");
                            } else if (response.status === "error") {
                                $('.result').text("Error!!");
                            }
                        }
                    });
                });
        </script>

试试这个

Answer 2

试试这个

var name = $("[name='name']").val();
var email = $("[name='email']").val();
var message = $("[name='message']").val();

      $.post('process.php',{name: name, email: email, message: message}, function(response){
                if (response.status === "success") {
                   $('.result').text("Success!!");
                } else (response.status === "error") {
                   $('.result').text("Error!!");
                }
        });

Answer 3

您的Jquery ajax设置选项＆＃34;数据类型＆＃34;您的任务的值不正确，因为您正在发送表单数据。你需要删除它。

datatype : 'html'

此外，您还需要将序列化的表单数据传递到设置选项＆＃34; data＆＃34;或者如果您的变量数据有效，您也可以传递它。

data: $('#contact_form').serialize()
// or
data: data

你需要通过返回false来阻止在没有ajax的情况下发送表单。

$form.submit(function() {
    $.ajax({
        url: $form.attr('action'),
        type: 'POST',
        data: $form.serialize(), // or data: data
        success: function(response) {
            ...
        }
    });

    return false;
});

PHP Ajax表单发送

3 个答案: