如何使用 node.js 从 html 表中检索选定的行答案

【问题标题】：How to retrieve selected row from html table using node.js如何使用 node.js 从 html 表中检索选定的行
【发布时间】：2021-09-17 04:02:52
【问题描述】：

我正在使用 express 和 node.js 创建一个 Web 应用程序。我有一个使用 ejs 和数据库中的数据生成的表。下面是创建表的代码：

<form action="/user-orders" method="POST">
                        <table id="order-history">
                            <thead>
                                <tr>
                                    <th>Date of Order</th>
                                    <th>Order ID</th>
                                    <th>Order Total</th>
                                    <th>Order Status</th>
                                    <th>Tracking Info</th>
                                    <th>Order Details</th>
                                </tr>
                            </thead>
                            <tbody>
                                <% orders.forEach(function(order){ %>
                                <tr>
                                    <td name="date"><%= order.date%></td>>
                                    <td name="id"><%= order.id%></td>
                                    <td name="cost"> &dollar;<%= order.cost.toFixed(2) %></td>
                                    <td name="status"><%= order.status%></td>
                                    </td>
                                    <td><input type="submit" class="profile-edit-btn"
                                            style="color:#0062cc; background:rgb(29, 29, 29); width:100%"
                                            name="viewTracking" value="View" id="viewTracking">
                                    </td>
                                    </td>
                                    <td><input type="submit" class="profile-edit-btn"
                                            style="color:#0062cc; background:rgb(29, 29, 29); width:100%"
                                            name="viewOrder" value="View" id="viewOrder">
                                    </td>
                                </tr>
                                <% }) %>
                            </tbody>
                        </table>
                    </form>

显示如下：

我想知道的是，当我单击其中一个按钮时，如何从所选行中获取值。

即：单击第 1 行中的视图将返回：

{
    date: Fri Sep 17 2021 00: 00: 00 GMT + 1200(New Zealand Standard Time),
    id: 2,
    cost: $5556.00,
    status: 'Pending',
}

我尝试了下面的两个代码sn-ps，但它们都返回未定义：

app.post('/user-orders', function (req, res) {
    var body = '';
    req.on('data', function (data) {
        body += data;
        if (body.length > 1e6)
            req.connection.destroy();
    });
    req.on('end', function () {
        var result = qs.parse(body);
        console.log(result);
    });
})

app.post('/user-orders', function (req, res) {
    console.log(req.body);
})

【问题讨论】：

重复的元素 id，例如视图详细信息输入和视图跟踪输入具有无效的 HTML，应该删除。就目前而言，客户端没有选择机制来告诉服务器单击了哪一行。您是否试图在前端没有 JavaScript？如果是这样，您可能需要一个单选按钮来选择一行，并且只有一对视图按钮。如果您确实想要一个智能前端，请分享您尝试过的代码？

标签： javascript html node.js express post

【解决方案1】：

由于您的整个<table> 仅包含一个 <form>，因此无论使用哪个提交按钮，所有 <tr> 行的内容都将提交给/user-orders被单击，并且字段名称将重复，正如已经指出的那样。

最好每<tr> 行有一个<form>，然后只会提交该行的内容。

请注意，HTML 表单将以 urlencoded 格式提交数据，例如

date=2021-09-17&id=2&cost=$5556.00&status=Pending&viewTracking=View

qs.parse 能解析这种格式吗？

【讨论】：