javascript - AJAX表单发送信息，PHP不执行

Question

几天前我遇到了这个确切形式的问题，并用不同的 PHP 修复了，谢谢你们。现在我改变了表格中的一件事，它不再起作用了。我已提醒所有通过 AJAX 发送的变量，它们是我需要的正确值。以下是 HTML 表单的代码:

 <?php
        include('php/connect.php');

        $chquery = "SELECT * FROM rooms";
        $chresult = mysqli_query($conn, $chquery);

        while($chrow = mysqli_fetch_array($chresult)){
            echo "<div class='edit_roomRow'>";
            echo "<h1> Rum " . $chrow['Roomnumber'] . "</h1>";
            echo "<form>";
            echo "Rumsnummer:<br> <input id='c-roomnumber' type='text' value = '" . $chrow['Roomnumber'] . "'><br>";
            echo "Beskrivning:<br> <input id='c-description' type='text' value = '" . $chrow['Description'] . "'>";
            echo "</form>";
            echo "<br>";
            *update* echo "<div class='btn btn-warning change-btn' data-value='". $chrow['ID'] . "' style='float: right; margin-top: 100px;'>Ändra</div>";
            echo "</div>";
            echo "<hr/>";
        }

        mysqli_free_result($chresult);

        mysqli_close($conn);

 ?>

AJAX 在这里:

<script type="text/javascript">
    $(".change-btn").click(function(){
        var id = $(this).attr("data-value");
        var description = $("#c-description").val();
        var roomnumber = $("#c-roomnumber").val();
        //Call to ajax
        $.ajax({
            method:"GET",
            url: "php/changepost.php",
            data:{ id: id, description: description, roomnumber: roomnumber },
            success: function(){
                $("#c-description").val("");
                $("#c-roomnumber").val("");
                //Reload specific div with rooms, avoid full page reload
                $(".changerooms").load(location.href + " .changerooms");
            }
        })
    })
</script>

我尝试过更改 php 等中的变量。

<?php
    mysqli_report(MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);
    include('connect.php');

    if(isset($_GET['id'])){
        $stmt = mysqli_prepare($conn, "UPDATE rooms SET Roomnumber = ?, Description = ?, WHERE ID = ?");
        mysqli_stmt_bind_param($stmt, "isi", $_GET['roomnumber'], $_GET['description'], $_GET['id']);
        mysqli_stmt_execute($stmt);
    }

    mysqli_close($conn);

?>

数据库的设置如下:

ID | Description | Roomnumber| Cleaned | Cleaner | Time

最后三个在这里无关紧要，但我想我会显示完整的数据库设置。我可以添加具有相同值的新帖子等，但是当涉及到更改某些内容时，此代码是不正确的。希望有人能帮助我:)

Answer 1

您在每个 DIV 中重复使用相同的 ID，您需要改用类。然后使用 DOM 遍历函数获取与用户点击的按钮相同的 DIV 中输入的值。

这将需要移动 </div>对于.edit_roomRow DIV 到 .change-btn 之后DIV，因此它与表单位于同一 DIV 中。

PHP:

<?php
include('php/connect.php');

$chquery = "SELECT * FROM rooms";
$chresult = mysqli_query($conn, $chquery);

while($chrow = mysqli_fetch_array($chresult)){
    echo "<div class='edit_roomRow'>";
    echo "<h1> Rum " . $chrow['Roomnumber'] . "</h1>";
    echo "<form>";
    echo "Rumsnummer:<br> <input class='c-roomnumber' type='text' value = '" . $chrow['Roomnumber'] . "'><br>";
    echo "Beskrivning:<br> <input class='c-description' type='text' value = '" . $chrow['Description'] . "'>";
    echo "</form>";
    echo "<br>";
    echo "<div class='btn btn-warning change-btn' data-value='". $chrow['ID'] . "' style='float: right; margin-top: 100px;'>Ändra</div>";
    echo "</div>";
    echo "<hr/>";
}

mysqli_free_result($chresult);

mysqli_close($conn);

?>

JS:

$(".change-btn").click(function(){
    var div = $(this).closest(".edit_roomRow");
    var id = $(this).attr("data-value");
    var description = div.find(".c-description").val();
    var roomnumber = div.find(".c-roomnumber").val();
    //Call to ajax
    $.ajax({
        method:"GET",
        url: "php/changepost.php",
        data:{ id: id, description: description, roomnumber: roomnumber },
        success: function(){
            div.find(".c-description").val("");
            div.find(".c-roomnumber").val("");
            //Reload specific div with rooms, avoid full page reload
            $(".changerooms").load(location.href + " .changerooms");
        }
    })
})