通过 AJAX 在 php 中编辑/更新数据答案

【问题标题】：Edit/Update data in php through AJAX通过 AJAX 在 php 中编辑/更新数据
【发布时间】：2022-02-05 23:44:03
【问题描述】：

在我的index.php 中，我正在从数据库中获取数据。我在上面放了一个编辑按钮，我使用了一个数据表来查看这个表单中的数据信息。我有四个字段：Name、Age、Email、Update 到 mysqli_fetch_array 我已经获取了数据。

这是index.php 文件：

<?php
//including the database connection file
include_once("config.php");

//fetching data in descending order (lastest entry first)
//$result = mysql_query("SELECT * FROM users ORDER BY id DESC"); // mysql_query is deprecated
// using mysqli_query instead
?>

<html>
    <head>  
        <title>Homepage</title>
        <link rel="stylesheet" href="DataTables/datatables.css" type="text/css">
        <link rel="stylesheet" href="DataTables/DataTables/css/dataTables.bootstrap.css" type="text/css">
        <link rel="stylesheet" href="DataTables/DataTables/css/jquery.dataTables.css" type="text/css">
        <script src="DataTables/datatables.js"></script>
        <script src="style/jquery-3.2.1.js"></script>
        <script src="style/datatable.js"></script>
        <script src="DataTables/DataTables/js/dataTables.bootstrap.js"></script>
        <script src="DataTables/DataTables/js/jquery.dataTables.js"></script>
    </head>

    <body>
        <a href="add.html">Add New Data</a><br/><br/>

        <table id="datatable" class="display" width='100%' border=0>
            <thead>
                <tr bgcolor='#CCCCCC'>
                    <td>Name</td>
                    <td>Age</td>
                    <td>Email</td>
                    <td>Update</td>
                </tr>
            </thead>
            <?php
//while($res = mysql_fetch_array($result)) { // mysql_fetch_array is deprecated, we need to use mysqli_fetch_array 
//$action=$_POST["action"];
//if($action=='showroom')
            {
                $result = mysqli_query($mysqli, "SELECT * FROM users ORDER BY id DESC");
                while ($res = mysqli_fetch_array($result)) {
                    echo "<tr>";
                    echo "<td>" . $res['name'] . "</td>";
                    echo "<td>" . $res['age'] . "</td>";
                    echo "<td>" . $res['email'] . "</td>";
                    echo "<td><a href=\"edit.php?id=$res[id]\">Edit</a> | <a href=\"delete.php?id=$res[id]\" onClick=\"return confirm('Are you sure you want to delete?')\">Delete</a></td>";
                }
            }
            ?>
        </table>
    </body>
</html>

这是我的edit.php 文件。首先，我检查空字段，然后运行更新重定向到显示页面的表查询。在我们的例子中，它是index.php，然后从 url 获取 id，选择与这个特定 id 关联的数据，通过mysqli_fetch_array 获取数据。

<?php
// including the database connection file
include_once("config.php");

$id = $_POST['id'];
$name = $_POST['name'];
$age = $_POST['age'];
$email = $_POST['email'];

// checking empty fields
if (empty($name) || empty($age) || empty($email)) {

    if (empty($name)) {
        echo "<font color='red'>Name field is empty.</font><br/>";
    }

    if (empty($age)) {
        echo "<font color='red'>Age field is empty.</font><br/>";
    }

    if (empty($email)) {
        echo "<font color='red'>Email field is empty.</font><br/>";
    }
} else {
    //updating the table
    $result = mysqli_query($mysqli, "UPDATE users SET name='$name',age='$age',email='$email' WHERE id=$id");

    //redirectig to the display page. In our case, it is index.php
    header("Location: index.php");
}


//getting id from url
$id = $_GET['id'];

//selecting data associated with this particular id
$result = mysqli_query($mysqli, "SELECT * FROM users WHERE id=$id");

while ($res = mysqli_fetch_array($result)) {
    $name = $res['name'];
    $age = $res['age'];
    $email = $res['email'];
}
?>
<html>
    <head>
        <title>Edit Data</title>
        <script src="style/jquery-3.2.1.js"></script>
        <script src="style/insert.js"></script>
        <script src="style/view.js"></script>
        <script src="style/edit.js"></script>
    </head>
    <body>
        <a href="index.php">Home</a>
        <br/><br/>

        <p id="message"></p>
        <form name="form1" method="POST" action="edit.php">
            <table border="0">
                <tr> 
                    <td>Name</td>
                    <td><input type="text" name="name" value="<?php echo $name; ?>"></td>
                </tr>
                <tr> 
                    <td>Age</td>
                    <td><input type="text" name="age" value="<?php echo $age; ?>"></td>
                </tr>
                <tr> 
                    <td>Email</td>
                    <td><input type="text" name="email" value="<?php echo $email; ?>"></td>
                </tr>
                <tr>
                    <td><input type="hidden" name="id" value=<?php echo $_GET['id']; ?>></td>
                    <td><input type="submit" name="update" id="update" value="Update"></td>
                </tr>
            </table>
        </form>
    </body>
</html>

最后，这是我的edit.js 文件。在这个文件中，我尝试通过 AJAX 编辑表单，但我找不到我做错的地方。

<script>
    $(document).ready(function (e) {
        $('#update').click(function (event)
        {
            event.preventDefault();

            $.ajax({
                data: $('form').serialize(),
                url: "edit.php", //php page URL where we post this data to save in database
                type: 'POST',
                success: function (strMessage) {
                    $('#message').text("strMessage");
                }
            })
        });
    });
</script>

【问题讨论】：

向我们展示edit.php文件中的代码
这是我的edit.php文件在哪里？
对不起先生，我已经粘贴了

标签： javascript php jquery html ajax

【解决方案1】：

您正在对同一文件进行编辑和更新，因此您必须在文件中添加条件。更改您的代码如下：

edit.php

<?php 
// including the database connection file
include_once("config.php");
if($_SERVER['REQUEST_METHOD'] == "POST")
{

    $id = $_POST['id'];
    $name = $_POST['name'];
    $age = $_POST['age'];
    $email = $_POST['email'];   

    // checking empty fields
    if(empty($name) || empty($age) || empty($email)) {  

        if(empty($name)) {
            echo "<font color='red'>Name field is empty.</font><br/>";
        }

        if(empty($age)) {
            echo "<font color='red'>Age field is empty.</font><br/>";
        }

        if(empty($email)) {
            echo "<font color='red'>Email field is empty.</font><br/>";
        }       
    } else {    
        //updating the table
        $result = mysqli_query($mysqli, "UPDATE users SET name='$name',age='$age',email='$email' WHERE id=$id");

        //redirectig to the display page. In our case, it is index.php
        header("Location: index.php");
    }

}
//getting id from url
$id = $_GET['id'];

//selecting data associated with this particular id
$result = mysqli_query($mysqli, "SELECT * FROM users WHERE id=$id");

while($res = mysqli_fetch_array($result))
{
    $name = $res['name'];
    $age = $res['age'];
    $email = $res['email'];
}
?>
<html>
<head>
    <title>Edit Data</title>
    <script src="style/jquery-3.2.1.js"></script>
    <script src="style/insert.js"></script>
    <script src="style/view.js"></script>
    <script src="style/edit.js"></script>


</head>

<body>
    <a href="index.php">Home</a>
    <br/><br/>

    <p id="message"></p>
    <form name="form1" method="POST" action="edit.php">
        <table border="0">
            <tr> 
                <td>Name</td>
                <td><input type="text" name="name" value="<?php echo $name;?>"></td>
            </tr>
            <tr> 
                <td>Age</td>
                <td><input type="text" name="age" value="<?php echo $age;?>"></td>
            </tr>
            <tr> 
                <td>Email</td>
                <td><input type="text" name="email" value="<?php echo $email;?>"></td>
            </tr>
            <tr>
                <td><input type="hidden" name="id" value=<?php echo $_GET['id'];?>></td>
                <td><input type="submit" name="update" id="update" value="Update"></td>
            </tr>
        </table>
    </form>
</body>
</html>

【讨论】：

谢谢先生工作正常，但我无法重定向到我的 index.php 页面。
如果我删除了我的 ajax，它也会进行编辑和重定向，但只有 ajax 发生编辑，没有错误显示
当你使用 ajax 时。您只能使用 javascript window.location 进行重定向
感谢它的工作，先生，你能为我定义这个数据吗：$('form').serialize(),