Question

我有一个JSP，我通过JSTL c：forEach循环显示元素。这是一个嵌套循环，如下所示：

<c:forEach items="${auditBudgetData.auditBudgetTierOneList}" var="auditBudgetTierOne" varStatus="tierOneCount">
        ** Some Code **     
    <c:forEach items="${auditBudgetTierOne.auditBudgetTierTwoList}" var="auditBudgetTierTwo" varStatus="tierTwoCount">
            ** Some Code ** 
                    <c:forEach items="${auditBudgetTierTwo.auditBudgetItemList}" var="auditBudgetItem" varStatus="budgetItemCount">
                        <input type="hidden" name="tierOneIndex" value="${tierOneCount.count}">
                        <input type="hidden" name="tierTwoIndex" value="${tierTwoCount.count}">
                        <input type="hidden" name="budgetItemIndex" value="${budgetItemCount.count}">

                            **Element rows displayed here**

现在，当用户选择内部循环中的任何元素行时，我将获取JS中的值。正如你所看到的，我正试图得到每个嵌套循环的计数：

<input type="hidden" name="tierOneIndex" value="${tierOneCount.count}">
<input type="hidden" name="tierTwoIndex" value="${tierTwoCount.count}">
<input type="hidden" name="budgetItemIndex" value="${budgetItemCount.count}">

尝试在JS中获取输入字段的值，如下所示：

var tierOneIndex = $('input[name="tierOneIndex"]').val();
var tierTwoIndex = $('input[name="tierTwoIndex"]').val();
var budgetItemIndex = $('input[name="budgetItemIndex"]').val();

但无论我选择什么元素，我总是得到：

tierOneIndex = 0
tierTwoIndex = 0
budgetItemIndex = 0

我如何获取计数值的任何想法。

Answer 1

在您的HTML中，您可以这样做

<table>

    <c:forEach items="${auditBudgetData.auditBudgetTierOneList}" var="auditBudgetTierOne" varStatus="tierOneCount">
            ** Some Code **     
        <c:forEach items="${auditBudgetTierOne.auditBudgetTierTwoList}" var="auditBudgetTierTwo" varStatus="tierTwoCount">
                ** Some Code ** 
                        <c:forEach items="${auditBudgetTierTwo.auditBudgetItemList}" var="auditBudgetItem" varStatus="budgetItemCount">


                            <input type="hidden" name="tierOneIndex"    id="tierOneIndex_${budgetItemCount.index}"        value="${tierOneCount.count}">
                            <input type="hidden" name="tierTwoIndex"    id="tierTwoIndex_${budgetItemCount.index}"        value="${tierTwoCount.count}">
                            <input type="hidden" name="budgetItemIndex" id ="budgetItemIndex_${budgetItemCount.index}"    value="${budgetItemCount.count}">

                            <tr class="rows" id="${budgetItemCount.index}"><td>click Here</td></tr>


    </table>

在javascript中你可以这样做

$(document).ready(function(){

$("tr.rows").click(function() {
    var rowid=this.id; 

var tierOneIndex = $('#tierOneIndex_'+rowid).val();
var tierTwoIndex = $('#tierTwoIndex_'+rowid).val();                         
var budgetItemIndex = $('#budgetItemIndex_'+rowid).val(); 

    console.log("tierOneIndex:"+tierOneIndex);
    console.log("tierTwoIndex:"+tierTwoIndex);
    console.log("budgetItemIndex:"+budgetItemIndex);
});

    });

注意：

${tierOneCount.index}从0开始计数

${tierOneCount.count}从1开始计算

我也为你创造了一个小提琴 http://jsfiddle.net/9CHEb/33/

Answer 2

类似方法

您将在此StackOverflow Q＆amp; A link中找到一种方法。

解决方案

详细地说，我会选择这样的（JSP）

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>

<script src="/*link to jQuery*/"></script>
<script>
   $(document).ready(function() {
       $("td").click(function(event) {
           var dtoItemIdx = $(this).attr("data");
           //alert("Selected idx: " + dtoItemIdx);
           console.info("Selected idx: " + dtoItemIdx);
       });
   });
</script>

<%-- Get the size of collection --%>
<c:set var="size" scope="page" value="${fn:length(dto.items)}" />
<c:out value="There are ${size} elements in the list." />

<table>
<c:forEach items="${dto.items}" var="item" varStatus="row">

    <tr><td data="${row.index}">
    <%-- Get the current index in the loop --%>
    <c:out value="Your content i.e [row idx: ${row.index}]." />
    </td></tr>

</c:forEach>
</table>

扩展

而不是只有一个循环，你可以显然嵌套几个循环。不同的索引可以存储在类似CSV的结构中：

...<td data="${row.index};${product.index};${properties.index}">...

如果这不能解决您的问题，请发表评论。

如何从JSP到JS获取嵌套JSTL c：forEach的索引

2 个答案:

类似方法

解决方案

扩展