Question

我正在使用for循环来显示表中api的数据：

for ($i = 0; $i < count($return['data']); $i++){
    echo "<tr><td>".$return['data'][$i]['data_id']."</td>";
    echo "<td>".'<button id="delete" class="btn btn-danger" value="'.$return['data'][$i]['data_id'].'" type="text">Delete</button>'."</td></tr>";
}

结果是一个表格，显示行中的data_id和删除按钮。现在，我希望能够在点击删除按钮时通过发送data_id到curl-> delete（api）代码来删除该项目！或者在单击删除按钮上的代码下面运行

curl --include \ --request DELETE \ --header "<secret key>" \ https://example.com/api/v1/data/{data_Iid}?app_id={appId}

我需要在循环中包含data_id并将其传递给curt删除代码。我使用onClick函数获取data_id的值，但它只显示每个删除按钮的第一个data_id值。

如何实现目标并能够通过正确的data_id来删除代码？谢谢，

Answer 1

出于性能原因，我会在表上放置一个事件监听器。一个JavaScript事件侦听器可以捕获按钮上的所有单击。看看下面的例子。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Button Value Event Listener</title>
    </head>
    <body>
        <table id="my-table">
        <thead>
            <tr>
                <th>Spalte 1</th>
                <th>Spalte 2</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Wert 1</td>
                <td>
                    <button value="1" name="delete[]">Mein Button</button>
                </td>
            </tr>
            <tr>
                <td>Wert 2</td>
                <td>
                    <button value="2" name="delete[]">Mein Button</button>
                </td>
            </tr>
        </tbody>
        </table>
        <script>
            var table = document.getElementById('my-table');
            table.addEventListener('click', function(event) {
                var target = event.target;

                if (target.tagName = 'BUTTON' && target.value) {
                    // remove and place your ajax request here
                    console.log(target.value);
                }
            });
        </script>
    </body>
</html>

通过这个例子，你将得到你在按钮的for循环中放置的所有值。请确保$return['data'][$i]['data_id']已设置并包含您期望的值。

在geiven示例中，您的ID只是在控制台中记录。请用您的异步JavaScript请求（AJAX）替换console.log。

使用curl

1 个答案: