个人中心
gpt4 book ai didi

javascript - 通过 AJAX 编辑/更新 php 中的数据

转载 作者：行者123 更新时间：2023-12-03 03:22:58 26 4
gpt4 key购买 nike

在我的 index.php 中，我正在从数据库中获取数据。我在其上放置了一个编辑按钮，并使用数据表来查看此表单中的数据信息。我有四个字段:Name、Age、Email、Update 通过 mysqli_fetch_array 我已获取数据。

enter image description here

这是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>

最佳答案

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

编辑.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>

关于javascript - 通过 AJAX 编辑/更新 php 中的数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46486487/

26 4 0
文章推荐： javascript - JavaScript 调用函数时不返回数据
文章推荐： javascript - JS & Jquery : functions goes crazy after being called.
文章推荐： javascript - 允许输入以 7,8 或 9 开头的手机号码
文章推荐： javascript - 解开 HTML 标签，仅保留第一级
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com