如果在提交表单时遇到多个变量

时间:2017-08-28 14:38:18

标签: php jquery ajax forms mysqli

我制作了这个典型的表单,在提交时显示淡入淡出的信息!它与最多2个变量完美配合,但是当我试图更改我的代码并插入第三个变量或更多时,提交时会出现问题。

html代码是:

<!DOCTYPE html>
<html>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Basic Form</title>
        <meta name="description" content="A basic fade in form">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
<head>
<title>Enable Disable Submit Button Based on Validation</title>
<style>
body{width:50%;min-width:200px;font-family:arial;}
#frmDemo {background: #98E6DB;padding: 40px;overflow:auto;}
#btn-submit{padding: 10px 20px;background: #555;border: 0;color: #FFF;display:inline-block;margin-top:20px;cursor: pointer;font-size: medium;}
#btn-submit:focus{outline:none;}
.input-control{padding:10px;width:100%;}
.input-group{margin-top:10px;}
#error_message{
    background: #F3A6A6;
}
#success_message{
    background: #CCF5CC;
}
.ajax_response {
    padding: 10px 20px;
    border: 0;
    display: inline-block;
    margin-top: 20px;
    cursor: pointer;
    display:none;
    color:#555;
}
</style>
</head>
<body>
<h1>jQuery Fade Out Message after Form Submit</h1>          
<form id="frmDemo" action="post-form.php" method="post">


   <div class="input-group">Name </div>
   <div>
        <input type="text" name="name" id="name" class="input-control" />
   </div>

   <div class="input-group">Message </div>
   <div>
        <textarea name="comment" id="comment" class="input-control"></textarea>
   </div>

   <div class="input-group">Lastname </div>
   <div>
        <input type="text" name="lastname" id="lastname" class="input-control" />
   </div>

   <div style="float:left">
        <button type="submit" name="btn-submit" id="btn-submit">Submit</button>
    </div>
    <div id="error_message" class="ajax_response" style="float:left"></div>
    <div id="success_message" class="ajax_response" style="float:left"></div>
</form> 
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>         
<script>
$("#frmDemo").submit(function(e) {
    e.preventDefault();
    var name = $("#name").val();
    var comment = $("#comment").val();
    var lastname = $("#lastname").val();

    if(name == "" || comment == "" || lastname == "" ) {
        $("#error_message").show().html("All Fields are Required");
    } else {
        $("#error_message").html("").hide();
        $.ajax({
            type: "POST",
            url: "form4.php",
            data: { name:name, comment:comment, lastname:lastname },   // *** Modify this
            success: function(data){
                $('#success_message').fadeIn().html(data);
                setTimeout(function() {
                    $('#success_message').fadeOut("slow");
                }, 2000 );
            }
        });
    }
})
</script> 
</body>
</html>

和php代码是:

<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "form4";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

if(isset($_POST['name']) && isset($_POST['comment']) && isset($_POST['lastname'])) { // **Change this

    $name = $_POST['name'];
    $comment = $_POST['comment'];
    $lastname = $_POST['lastname'];

    $sql = "INSERT INTO step4 (name, comment, lastname) VALUES ('{$name}', '{$comment}' '{$lastname}')";

    if ($conn->query($sql)) {
    echo "New record created successfully";
    } else {
    echo "Error: " . $sql . "<br>" . $conn->error;
    }

} else {
    echo "Either Name or Comment field not set";    // **Change this
}

$conn->close();
?>

我认为问题与if isset POST方法中我的php代码中的一些错误有关,因为它可以处理2个变量但不能再...

2 个答案:

答案 0 :(得分:0)

您在SQL查询中使用逗号 - 但是,如果您在数据库中设置默认值,则不会抛出错误。

我认为,问题出在数据&#39;中的JSON对象中。 AJAX选项中的字段。 尝试更改语法:

$.ajax({
            type: "POST",
            url: "form4.php",
            data: "name="+name+"&comment="+comment+"&lastname="+lastname,
            success: function(data){
                $('#success_message').fadeIn().html(data);
                setTimeout(function() {
                    $('#success_message').fadeOut("slow");
                }, 2000 );
            }
        });

答案 1 :(得分:0)

您的查询中有语法,您忘记了逗号:

$sql = "INSERT INTO step4 (name, comment, lastname) VALUES ('{$name}', '{$comment}' '{$lastname}')";

介于'{$comment}' '{$lastname}'之间。

如下所示:

{$comment}', '{$lastname}

因此您的代码应如下所示:

<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "form4";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

if(isset($_POST['name']) && isset($_POST['comment']) && isset($_POST['lastname'])) { // **Change this

    $name = $_POST['name'];
    $comment = $_POST['comment'];
    $lastname = $_POST['lastname'];

    $sql = "INSERT INTO step4 (name, comment, lastname) VALUES ('{$name}', '{$comment}', '{$lastname}')"; // here the problem occurs

    if ($conn->query($sql)) {
    echo "New record created successfully";
    } else {
    echo "Error: " . $sql . "<br>" . $conn->error;
    }

} else {
    echo "Either Name or Comment field not set";    // **Change this
}

$conn->close();
?>

出错,你可以查看你的查询:

  

错误:INSERT INTO step4(name,comment,lastname)VALUES(&#39; aths&#39;,   &#39;如&#39; &#39; asa&#39;)列数与第1行的值计数不匹配

表示您的查询在值asasa之间没有逗号