2009-04-02 6 views
0

Je crée une liste de données à l'aide du contrôle répéteur. Certaines des lignes peuvent avoir d'autres lignes qui doivent être basculées en utilisant l'image cliquable de la ligne principale.

Ici, est la partie HTMLBasculer les lignes créées à l'aide du contrôle répéteur ASP.NET

<table cellpadding="2" cellspacing="0" width="100%"> 
       <asp:Repeater ID="repeatLockers" runat="Server"> 
        <HeaderTemplate> 
         <tr> 
      <td>&nbsp;</td> 
          <td>A</td> 
         </tr> 
        </HeaderTemplate> 
        <ItemTemplate> 
         <tr id="trItem" class="SomeParentClass" runat="server"> 
          <td> 
           <img id="imgToggleHomeInfo" runat="server" alt="show/hide repetitves" src="icon_plus.gif" 
            style="cursor: pointer" /> 
          </td> 
          <td> 
           <asp:Label ID="lbl" runat="server"></asp:Label> 
          </td> 
         </tr> 
         <tr id="trAddOnFee" runat="server" class="SomeClass" style="display: none;"> 
          <td colspan="2"> 
           <table cellpadding="4" cellspacing="2" width="100%"> 
            <tr> 
             <td class="DgHeader">A</td> 
             <td class="DgHeader">B</td> 
            </tr> 
            <asp:Repeater ID="repeatRepetitives" runat="server"> 
             <ItemTemplate> 
              <tr> 
               <td> 
                <asp:Label ID="lblA" runat="server"></asp:Label> 
               </td> 
               <td align="right"> 
                <asp:Label ID="lblB" runat="server"></asp:Label> 
               </td> 
              </tr> 
             </ItemTemplate> 
            </asp:Repeater> 
           </table> 
          </td> 
         </tr> 
        </ItemTemplate> 
       </asp:Repeater> 
      </table> 

Comment pourrais-je passer les lignes avec classe comme l'image "SomeClass" à l'intérieur de clic de imgToggleHomeInfo » sur sa ligne parent en utilisant Jquery?

Répondre

1

I'D trouver la ligne parente de l'image puis bascule il est à côté frère

$(document).ready(function() { 
    $("[id$='imageToggleHomeInfo']").click(function() { 
     $(this).closest('tr').next().toggle(); 
    }); 
}) 
+0

$ (this) .parent ('tr') suivante() toggle() ne fonctionne pas Mais cela fonctionne:.... $ (this) .parent(). parent(). next(). toggle(); –

+0

Le parent doit uniquement rechercher le parent immédiat. La chose parent() .par parent() est correcte, mais vous pouvez utiliser la méthode parents() pour voir tous les ancêtres de l'élément. Cela dépendrait de ce que cette table ne soit pas contenue dans une autre table. Si c'est le cas, vous devrez peut-être utiliser 'tr: last'. – tvanfosson

+0

+1 - si vous pouvez mettre à jour ceci pour utiliser '.closest ('tr')', je réalise qu'il n'était pas disponible au moment de la réponse, mais il serait utile pour les futurs googleurs :) –

Questions connexes