forms - 从 JSTL 中的列表中选择一个项目

Question

在下面的 JSP 中，我有一个列表，我正在迭代和打印一个附加按钮

JSP

<form action="servlet">
                                <table border="2">
                                    <th>Req no</th>
                                    <th>username</th>
                                    <th>Leave Type</th>
                                    <th>No of Days Requested</th>
                                    <th>Status</th>
                                    <th>Approve</th>
                                    <c:forEach var="pro" items="${userRequest}">
                                        <tr>
                                            <td><c:out value="${pro.reqno}"></c:out></td>
                                            <td><c:out value="${pro.user_name}"></c:out></td>
                                            <td><c:out value="${pro.leave_Type}"></c:out></td>
                                            <td><c:out value="${pro.no_of_days}"></c:out></td>
                                            <td><c:out value="${pro.status}"></c:out></td>
                                            <td><input type="submit" value="approve"></td>
                                            <td><input type="hidden" name="approve" value="yes"></td>
                                            <td><input type="hidden" name="reqno" value="${pro.reqno}"></td>
                                        </tr>
                                    </c:forEach>
                                </table>
                            </form>

如果我单击表单中的批准按钮，隐藏字段将采用所有行的值。我需要单独从单个行发布 reqno（即）我单击按钮的行。请给我一个想法。提前致谢 ！

Answer 1

1. 您需要将“批准”按钮从“提交”类型更改为“按钮”类型。

2. 您删除 TR 中的“隐藏”输入。

3. 示例代码：

   <tr>
       <td><c:out value="${pro.reqno}"></c:out></td>
       <td><c:out value="${pro.user_name}"></c:out></td>
       <td><c:out value="${pro.leave_Type}"></c:out></td>
       <td><c:out value="${pro.no_of_days}"></c:out></td>
       <td><c:out value="${pro.status}"></c:out></td>
   
       <td><input type="button" class="btnApproveReq" data-reqno="${pro.reqno}" value="approve"></td>
   </tr>
   

4. 使用 jQuery 处理 onclick：

   <script type="text/javascript">
       $(document).ready(function () {
   
            $(".btnApproveReq").click( 
                function() {
                    var selectedReqNo = $(this).attr("data-reqno");
   
                    var urlToApprove = "/yourApp/req/approve?reqno=" + selectedReqNo;
   
                    // CALL AJAX to urlToApprove 
   
                    // Call this If you want to remove TR after AJAX success
   
                    // $(this).parent() --> TD
                    // $(this).parent().parent() --> TR
                    $(this).parent().parent().remove();
                }
            );
       });
   </script>