Question

我想要做的是在用户填写完所有表格后使用Ajax和PDO保存所有数据。

我的问题是我的Ajax不会发送给user.php。单击“数据未定义”按钮后，控制台出现错误。任何人都可以帮我修改我的代码吗？

HTML

<form method="post" enctype="multipart/form-data">  
<img id="picture" data-src="#" /> <br />
<input type='file' name="image" id="imgInp" accept="image/*" /><br />
Name: <input type="text" id="name" name="name" /><br />
Age: <input type="text" id="age" name="age" /><br />
Address: <input type="text" id="address" name="address" /><br />
<input type="radio" name="gender" id="gender" value="male" />Male
<input type="radio" name="gender" id="gender" value="Female" />Female<br />
<input type="submit" name="submit" id="submit" value="submit" />
</form>

的Ajax

<script type="text/javascript">
$(document).ready(function() {

   $('#submit').click(function (e) {
       e.preventDefault();


        data.name = $('#name').val();
        data.age = $('#age').val();
        data.gender = $('#gender').val();
        data.address = $('#address').val();
        data.image = $('#imgInp').val();


        $.ajax({
            type: "POST",
            url: "user.php",
            data: data,
            cache: false,
            success: function (response) {

            }
        });
            return false;
    });

});
</script>

user.php的

<?php
$host = "localhost";
$user = "root";
$pass = "";
$db = "test";

$dbc = new PDO("mysql:host=" . $host . ";dbname=" . $db, $user, $pass);
$dbc->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

$name = @$_POST['name'];
$age = @$_POST['age'];
$address = @$_POST['address'];
$gender = @$_POST['gender'];
$imageName = @$_FILES['image']['name'];


 $q = "INSERT INTO students(name, age, address, gender, imageName ) VALUES(:name, :age, :address, :gender, :image)";

    $query = $dbc->prepare($q);
    $query->bindParam(':name', $name);
    $query->bindParam(':age', $age);
    $query->bindParam(':address', $address);
    $query->bindParam(':gender', $gender);
    $query->bindParam(':image', $imageName);


    $results = $query->execute();

?>

Answer 1

您似乎忘了定义数据变量。

var data = {};
data.name = $('#name').val();

Answer 2

您应该按照data初始化var data = {};对象。

还要考虑将数据重命名为param之类的内容。只是为了不干扰$.ajax({}); - 函数中的保留名称。这只是开发人员的一个提示。

如何使用Ajax和PDO保存数据

2 个答案: