使用变量中的值更新选中的元组复选框的数据库

Question

我正在尝试使用 php 和 javascript 设置网页。在这个网站上有一张表格显示了来自 postgres 数据库的相关数据。这张表在表单标签内，所以我每行都有复选框。

每一行都有“新”、“用过”、“损坏”等状态。

用户应该选择他想要更改的行，并且对于这些行，新状态（由用户选择）应该保存在数据库中。

如果我手动设置状态，这会起作用。像下面这样：

        <div id="refresh-section">
            <form id="chk-input" role="form" method="post">
                <?php
                $object= new Object();
                $object = $object->getObjectProjekt();
                ?>
            </form>
        </div>

然后我有一个 JS 函数，它获取选中的复选框

        <script>
            var form = document.getElementById('chk-input');

            document.getElementById('button').addEventListener('click', function(e) {
                var fskz = [];

                form.querySelectorAll('input').forEach(function(input) {
                    if (input.type === 'checkbox' && input.checked) {
                        fskz.push(input.value);
                    }
                })
                string_json = JSON.stringify(fskz);
                console.log(fskz);
                $.ajax({
                    method: "post",
                    data: {
                        fskz: JSON.stringify(fskz)
                    }
                })
            }
            )
            
        </script>

这很好用。我将所选行的 ID 作为数组获取。因此，使用以下代码更新数据库：

        <?php

        $fskz = json_decode($_POST['fskz'], true);
        $status = "new"; // this status should be chosen by user 

        foreach ($fskz as $fkz) {
            $objectUp = new Object();
            $objectUp->updateObjectStatus($status, $fkz);
        }
        ?>

正如我所说，这仅在我在 $status = "new" 中设置状态时有效。 我尝试使用不同的按钮，但不知何故只有第一个按钮有效，其他按钮无效。 我还尝试使用状态下拉菜单，但这也不起作用。在这种情况下，您需要第二个按钮来保存从下拉列表中选择的变量状态。然后该函数设置一个空状态。

你们中有人知道如何解决这个问题吗？多谢！ :)

Answer 1

你试过使用

select

吗？这是一个如何让用户选择状态的示例。

<div id="refresh-section">
    <form id="chk-input" role="form" method="post">
        <?php
        $object= new Object();
        $object = $object->getObjectProjekt();
        ?>
        <select id="status-select">
            <option value="new">New</option>
            <option value="used">Used</option>
            <option value="broken">Broken</option>
        </select>
        <button id="update-button" type="button">Update</button>
    </form>
</div>

之后，我们将

status

在发布数据中传回我们的服务器。

<script>
    var form = document.getElementById('chk-input');

    document.getElementById('update-button').addEventListener('click', function(e) {
        var fskz = [];

        form.querySelectorAll('input').forEach(function(input) {
            if (input.type === 'checkbox' && input.checked) {
                fskz.push(input.value);
            }
        })

        var status = document.getElementById('status-select').value;

        $.ajax({
            method: "post",
            data: {
                fskz: JSON.stringify(fskz),
                status: status
            }
        })
    });
</script>

在服务器中，我们从

status

变量中获取

$_POST

。

<?php

$fskz = json_decode($_POST['fskz'], true);
$status = $_POST['status'];

foreach ($fskz as $fkz) {
    $objectUp = new Object();
    $objectUp->updateObjectStatus($status, $fkz);
}
?>

现在应该允许用户为对象选择

status

。