使用ajax php提交表单

时间:2017-05-22 05:24:27

标签: php ajax forms

使用ajax提交简单的联系表单。

已编辑的代码 现在尝试将数据插入数据库。

html表单

        <form align="left" method="post" class="subscribe_form" action='subscribe.php'> 

                    Your Name:<br>
  <input type="text" name="name" value="" required><br>

Your E-Mail:<br>
  <input type="email" name="email" value="" required><br><br>

  Gender:
  <p>    <input name="gender" value="male" type="radio" id="male" />
      <label for="male">Male</label>

      <input name="gender" value="female" type="radio" id="female" />
      <label for="female">Female</label>
    </p>
<br>

Company Name:
<input type="text" name="cname" value="" required><br><br>
<input type="submit" name="send" value="Subscribe" id="subscribe"> <span class="output_result"></span>
</form>

这是我的ajax代码:

    <script>

$(document).ready(function() {
    $('.subscribe_form').on('submit',function(){

        // Add text 'loading...' right after clicking on the submit button. 
        $('.output_result').text('Sending...'); 

        var form = $(this);
        $.ajax({
            type:'post',
            url:'subscribe.php',
            dataType: "text",
            data: form.serialize(),
            success: function(result){
                if (result == 'success'){
                    $('.output_result').text('thank you!');  
                } else {
                    $('.output_result').text('Error!');
                }
            }
        });

        // Prevents default submission of the form after clicking on the submit button. 
        return false;   
    });
}); 
</script>

subscribe.php

$servername = "localhost";
$username = "root";
$password = "";
$dbname = "rm";

    $name = $_POST['name'];
    $gender = $_POST['gender'];
    $email = $_POST['email'];
    $cname = $_POST['cname'];
    $sub_date = date("Y-m-d");



// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
    die("Connection failed: " . mysqli_connect_error());
}

$sql = "insert into rmsubscribe (name, gender, email, cname, sub_date) values ('$name', '$gender','$email','$cname','$sub_date')";
$result = (mysqli_query($conn, $sql));

echo ($result) ? 'success' : 'error'; */

mysqli_close($conn);

这段代码给我'错误信息'。

如果我使用没有像这样的ajax代码,

表格,

没有'class =“subscribe_form”..

和subscribe.php

 if (mysqli_query($conn, $sql)) {
    echo "New record created successfully";
} else {
    echo "Error: " . $sql . "<br>" . mysqli_error($conn);
} 

而不是

$result = (mysqli_query($conn, $sql));
echo ($result) ? 'success' : 'error'; 

它工作正常。 “成功创建新记录”数据插入表中。

请帮我解决ajax代码问题。我不熟悉ajax。如何使用ajax使这项工作?

1 个答案:

答案 0 :(得分:-1)

我认为您需要将数据类型添加到您的ajax请求中。实际上你的ajax请求是期待json并且你正在返回文本 - “成功”不是json,这就是为什么当它获得意外数据返回时它正在向错误函数发送ajax响应。将代码更新为ajax请求 -

当您返回Text作为对ajax请求的响应时,所以您的ajax请求数据类型必须是ajax请求中代码行下面的文本 -

dataType: "text"

您预期的Ajax请求示例

 $.ajax({
            type:'post',
            url:'email.php',
            dataType: "text",
            data: form.serialize(),
            success: function(result){
                if (result == 'success'){
                    $('.output_message').text('Message Sent Successfully!');  
                } else {
                    $('.output_message').text('Error Sending email!');
                }
            }
        });

        // Prevents default submission of the form after clicking on the submit button. 
        return false;   
    });