如何使用PHP和AJAX删除/编辑SQL条目?

时间:2018-08-22 15:13:46

标签: javascript php jquery mysql ajax

我正在学习PHP和SQL,作为练习,我正在研究一个页面,该页面实际上类似于列出电影的网站的管理面板。我正在使用lampp和phpmyadmin创建了一个简单的数据库,其中包含两个表,电影列表和用户列表。

因为我是初学者,我的代码可能很凌乱,所以我描述了我试图实现的目标。在login.php页面上,唯一的功能是键入用户名和密码。如果信息与SQL表中的信息匹配,则用户进入adminpanel.php。

此页面应加载电影列表并使用该数据创建表。在每一行的末尾,我需要两个按钮,即编辑和删除。我想要实现的是删除单击删除按钮的当前行,即删除按钮。 “编辑”按钮应仅在单击按钮的行中显示隐藏的表单。该表单将包含在填写表单并单击按钮后实际上更新SQL表中数据的按钮。 (我还没有添加显示表单的功能,我更关心按钮)在文件末尾添加电影的表单可以使用。

这是adminpanel.php

    <html>
    <head>
        <script src="https://code.jquery.com/jquery-3.3.1.js" 
                integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
                crossorigin="anonymous">
        </script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/core.js"></script>
        <script type="text/javascript" src="changes.js"></script>
        <script type="text/javascript" src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"></script>

        <style type="text/css">

            *{text-align: center;}

            .skriveni_input{
                display: none;
            };

        </style>
    </head>

<?php 
    require_once('connection.php');

    if(!isset($_POST['btnlogin'])){
            exit;
        } 

        $username = $_POST['username'];
        $password = $_POST['password'];
        $query = "SELECT usrname,password FROM usrs WHERE usrname='$username' AND password='$password' ";

        $res = mysqli_query($conn,$query);
        $rows = mysqli_num_rows($res);

        if($rows == 1){
            echo "Welcome ".$_POST['username']."<br><br>";
        } else {
            echo "<script>
                alert('Wrong login info');
                window.location.href='login.php';
                </script>";
            exit;
        }

        $query = "SELECT * FROM movies";
        $result = $conn->query($query);

        echo "<table align = center cellspacing = 0 border = 0;><thead><tr><th>Name</th><th>Year</th><th>Genre</th></tr></thead><tbody>";
        while ($row = mysqli_fetch_array($result)) {
            echo "<tr>";
            echo '<td id="row_id" style="display:none;" value="'.$row["movie_id"].'">'.$row["movie_id"].'</td>';
            echo '<td>'.$row["name"].'</td>';
            echo '<td>'.$row["year"].'</td>';
            echo '<td>'.$row["genre"].'</td>';
            echo '<td><input type="submit" name="edit" value="edit" data-index="' . $row['movie_id'] . '" class="btnedit" id="btnedit"></input></td>';
            echo '<td><input type="submit" name="delete" value="delete" class="btndlt" id="btndlt"></input></td>';
            echo "</tr>";
            echo "<tr>
                      <td><input type='text' class='hidden_input' id='hidden_name" . $row['movie_id'] . "'placeholder='hidden name'></input></td>
                      <td><input type='text' class='hidden_input' id='hidden_year" . $row['movie_id'] . "'placeholder='hidden year'></input></td>
                      <td><input type='text' class='hidden_input' id='hidden_genre" . $row['movie_id'] . "'placeholder='hidden genre'></input></td>
                 </tr>";
        }
        echo "</tbody></table>";
?>

    <h3>Add movie form: </h3>
    <form action="" method="POST">
        <label for="movie_name">Movie name : </label>
        <input type="text" name="movie_name" id="movie_name">
        <br><br>
        <label for="movie_year">Year: </label>
        <input type="text" name="movie_year" id="movie_year">
        <br><br>
        <label for="movie_genre">Genre: </label>
        <input type="text" name="movie_genre" id="movie_genre">
        <br><br>
        <input type="submit" name="submit_movie" id="submit_movie" value="Submit"> 
    </form>

</html>

这是我的带有ajax调用的javascript文件:

$(document).ready(function(e){

    $('#submit_movie').click(function(e){
        e.preventDefault();
        var movie_name = $('#movie_name').val();
        var movie_year = $('#movie_year').val();
        var movie_genre = $('#movie_genre').val();

        $.ajax({
            type: 'POST',
            data: {movie_name:movie_name, movie_year:movie_year, movie_genre:movie_genre},
            url: "insert.php",
            success: function(result){
                        alert('Movie ' + movie_name + ' (' + movie_year + ')' +' added successfully.');
                        document.location.reload();
                    }
        })
    });

    $('.btnedit').click(function(e){
        var id = $(this).parent().prev().prev().prev().prev().html();
        alert(id);
        //unfinished function
    })

    $('.btndlt').click(function(e){
        var id = $(this).parent().prev().prev().prev().prev().prev().html();
        e.preventDefault();
        $.ajax({
            type: 'POST',
            data: {id:id},
            url: 'delete_row.php',
            success: function(result){
                alert('Successfully deleted.');
                document.location.reload();
            }
        })
    })

});

这是用于添加电影的php页面,insert.php(此方法有效,仅将其发布以获取更多信息):

<?php 
require_once('connection.php');

if($_REQUEST['movie_name']){
    $name = $_REQUEST['movie_name'];
    $year = $_REQUEST['movie_year'];
    $genre = $_REQUEST['movie_genre'];

    $sql = "INSERT INTO movies(name, year, genre) VALUES ('$name','$year','$genre')";
    $query = mysqli_query($conn, $sql);

}


?>

这是用于使用“删除”按钮删除条目的delete_row.php文件:

<?php 
require_once('connection.php');

    $id = $_REQUEST['id'];

    if(isset($_REQUEST['delete'])){
        $sql = "DELETE FROM `movies` WHERE movie_id = $id";
        $query = mysqli_query($conn, $sql);
    }
 ?>

您可能会看到php和ajax遍地都是,因为我试图实现多种解决方案或将它们混合以解决问题。 在此阶段,当我单击“删除”按钮时,会收到警告消息,提示擦除成功,并且adminpanel.php会重新加载电影列表。但是电影仍然存在并且在SQL数据库中。

当我尝试调试delete_row.php时,我发现每次都没有定义索引“ id”,即使我认为我是通过ajax调用传递它的。

编辑

我应该说安全性现在不是我关心的问题,我仅针对我描述的功能进行此练习。 :)安全是我的下一步,我知道这段代码根本不安全。

1 个答案:

答案 0 :(得分:1)

  

当我尝试调试delete_row.php时,我发现索引“ id”为   每次都不确定,即使我认为我正在用ajax传递它   打电话。

发生这种情况的原因可能是因为您正在直接通过浏览器访问delete_row.php,并且由于未提交表单(以后将通过ajax提交),因此$ _REQUEST变量始终是未定义的。

将来在调试$ _REQUEST(或$ _POST)变量时,应使用Postman,在那里您可以实际请求该php文件发送自己的POST参数。

在您的特定代码上,由于以下原因,查询将永远不会运行:

if(isset($_REQUEST['delete']))

正在检查从未被发送过的delete变量,因此将始终解析false

在delete_row.php上使用以下代码:

<?php 
require_once('connection.php');
    if(isset($_REQUEST['id'])){
        $id = $_REQUEST['id'];
        $sql = "DELETE FROM `movies` WHERE movie_id = $id";
        $query = mysqli_query($conn, $sql);
    }
 ?>