使用 AJAX 传递具有多个 id 的表单并选择到 PHP

Question

我正在尝试收集选定的复选框，对其进行更新或删除操作，并通过ajax将此表单传递给php。我对这件事很陌生，花了几天时间试图找出方法。

网络研究没有给我任何结果，我尝试通过几种不同的方式发送ajax - 没有结果。虽然仅使用 PHP，我得到了带有 select 和 ids 数组的表单。

如何使其与 AJAX 配合使用？

我的表单。它放在桌子里面。表的主体位于 php 文件中。该文件中的模态窗口内还有其他形式，仅提及是否可能发生冲突。

<div class="inner">
                <div class="option">
                        <div class="e-table">
                            <div class="table-responsive table-lg mt-3">
                                <form method="post" id="menu_form">
                                <table class="table table-bordered">
                                        <select name="select" id="menu" >
                                            <option value="select">Please select</option>
                                            <option value="set-active">Set active</option>
                                            <option value="set-not-active">Set not active</option>
                                            <option value="delete">Delete</option>
                                        </select>
                                    <thead>
                                        <tr>
                                            <th class="text-nowrap align-middle"><input type="checkbox" id="select-all"></th>
                                            <th>Name</th>
                                            <th>Role</th>
                                            <th>Status</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                <tbody id="users_data">
                                <input type="submit" value="submit" name="submit_btn" />

                                </tbody>
                                </table>
                                </form>

                            </div>
                        </div>
                </div>
            </div>

这是我正在尝试使用 AJAX 进行的操作。

<script type="text/javascript">
    $(document).ready(function() {
        $('#menu_form').on('submit', function (e) {
            e.preventDefault();

            $.ajax({
                type: 'post',
                url: "process.php",
                data: $('#menu_form').serialize(),
                success: function (response) {
                    console.log(response)
                }
            });
        });
    });

我的 PHP。表的主体和处理表单提交。仅显示对其中一个选项的处理，以免使该问题变得更长，其他选项几乎相同。

<td class="text-nowrap align-middle"><input type="checkbox" name="update_id" value="<?= $row['id'] ?>"></td>
        <td class="text-nowrap align-middle"><?= $row['name']; ?></td>
        <td class="text-nowrap align-middle"><?= $row['role']; ?></td>
        <td class="text-center align-middle">
            <?php if ($row['status'] == 1): ?>
                <i class="fa fa-circle active-circle"></i>
            <?php else: ?>
                <i class="fa fa-circle not-active-circle" style="color:grey"></i>
            <?php endif; ?>
        </td>
        <td class="text-center align-middle"><button class="btn btn-sm btn-outline-secondary badge" type="button"
                    onclick="edit_record(<?= $row['id']; ?>)" >Edit</button>
            &nbsp;<button class="btn btn-sm btn-outline-secondary badge" type="button"
                    onclick="delete_record(<?= $row['id']; ?>)" ><i class="fa fa-trash"></i></button>
        </td>
    </tr>

if(isset($_POST['submit_btn'])) {
    $idArray = $_POST['update_id'];
    $idString = implode(',', $idArray);

    if (isset($_POST['select']) && $_POST['select'] == 'set-active') {
        $statement = $pdo->prepare("UPDATE user SET status = 1 WHERE id IN ($idString)");
        $result = $statement->execute();
        if ($result) {
            $response = array('status' => true, 'message' => 'Record edited successfully.');
        }else{
            $response = array('status' => true, 'message' => 'Error');
        }

        echo json_encode($response);    
    }

Answer 1

在我看来，问题出在这里：

if(isset($_POST['submit_btn'])) {

表单中的不是正文/有效负载的一部分 与 POST 请求一起发送（毕竟，它是一个按钮，并且不包含任何对服务器有用的信息）。

因此，上面的 if() 检查将始终为 false，并且 if() 块内的所有代码块都将失败。不会被执行。