2010-11-18 3 views
0

Respecté Monsieur/Madame,comment boucle la ligne dynamique dans une table à l'aide jquery

En fait, ma demande est de placer les données dans un tableau de bord en utilisant la boucle foreach en dynamique jsp qui contient beaucoup de données montrant si iam seulement une rangée et cachant les restants et plaçant un bouton pour chaque rangée de sorte que si nous cliquons sur le bouton il doit montrer les rangées cachées pour cette rangée particulière mais il montre toutes les rangées s'il vous plaît aidez-moi comment ralentir cet iam attachant mon code ici merci d'avance.

<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(); 
     } 
     }); 



} 

Répondre

0

Fournir le bouton comme argument à la fonction:

onclick="show(this)" 

Il est donc facile à parcourir et trouver les objets dont vous avez besoin:

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'); 

} 

test du violon: http://www.jsfiddle.net/doktormolle/nSaWn/

Questions connexes