wie meine Anwendung der dynamischen Zeile Schleife in einer Tabelle mit Jquery

Question

Respected Herr/Frau,

Eigentlich ist es, die Daten in einem Armaturenbrett legen die forEach Schleife in JSP dynamisch über die viele Daten so IAM Darstellung enthält nur eine Zeile und versteckt die restlichen und platzieren eine Schaltfläche für jede Zeile, so dass, wenn wir auf die Schaltfläche klicken, um die ausgeblendeten Zeilen für diese bestimmte Zeile anzuzeigen, aber es zeigt alle Zeilen an, bitte helfen Sie mir, wie ich diesen Anhang zu verlangsamen Code hier Danke im Voraus.

<c:forEach items="${fvaData}" var="fva"> 
<tr> 
<td > 
<input size="30" value="<c:out value="${fva.conIdNumber}"/>"/> 

</td> 

<td > 
<input size="30" value="<c:out value="${fva.flightDate}"/>"/> 
</td> 


<td > 
<input size="30" value="<c:out value="${fva.consigneeCityAirportName}"/>"/> 
</td> 

<td > 

<td align="center" > 
<input type="button" id="Button" value="Populate" name="FTR" onclick="show()";/></td> 

</tr> 
<tbody class="hiddenDiv"> 
<tr><td>Consignment Number</td><td><input size="40" value="<c:out value="${fva.conIdNumber}"/>"/></td> 
<td>Airway Bill</td><td><input size="40" value="<c:out value="${fva.airWayBill}"/>"/></td> 
</tr> 
<tr> 
<td>Flight Number</td><td> <input size="40" value="<c:out value="${fva.fightNumber}"/>"/></td> 
<td>Carrier Code</td><td><input size="40" value="<c:out value="${fva.answerCarrierCode}"/>"/></td> 
</tr> 




</table> 
</c:forEach> 


and my script is as follows 
function show() 
{ 

     $(".hiddenDiv").each(function (i) { 
     if ($(this).is(":hidden")) { 
      $(this).slideDown("fast"); 
     } else { 
      $(this).hide(); 
     } 
     }); 



} 

Answer 1

Geben Sie die Taste als Argument an die Funktion:

onclick="show(this)" 

So ist es einfach, die Objekte zu überqueren und finden Sie brauchen:

function show(btn) 
{ 
    var btn=$(btn); 
    var tbl=btn.parents('table'); 
    var row=btn.parents('tbody'); 
    var next=row.next(); 

    $('tbody.hiddenDiv',tbl).hide(); 
    next.slideDown('fast'); 

} 

Testen Sie die Geige: http://www.jsfiddle.net/doktormolle/nSaWn/