Pourquoi je ne peux pas afficher/masquer Html TR en utilisant jquery?

Question

Je donne les résultats suivants TR en HTML et i en utilisant JQuery

<tr class="RowDiv" id="tempTR" runat="server" visible="false">     <td> 
        <div class="LabelDiv"> 
         <div class="dfltTxtBld"> 
          ID<span class="reqChar" runat="server" id="Span1" visible="false"> 
           *</span> 
         </div> 
        </div> 
       </td> 
       <td> 
        <div class="InputDiv"> 
         <asp:TextBox ID="TextBox1" runat="server" CssClass="txtField" MaxLength="10"></asp:TextBox> 
        </div> 
       </td> 
       <td> 
        <div id="Div1" runat="server"> 
        </div> 
       </td> 
      </tr> 

et code javascript i appelé la méthode suivante pour cacher

$('#<%= tempTR.ClientID %>').hide(); 

mais toujours n'a pas affecté même je tente de le rendre caché et puis montrer aussi ne fonctionne pas .. j'essaie de cacher & montre TextBox1 et cela fonctionne mais si j'essaye avec la rangée cela ne fonctionne pas ... est-il un moyen de montrer/cacher TR?

Answer 1

Je pense que vous avez le même problème que dans ce post JQuery .Show() doesn't work with server control?

Answer 2

Si je fais cela onLoad cela fonctionne

$(document).ready(function(){ 
    $('#tempTR').hide(); 
}); 

Peut-être que votre problème se trouve ailleurs?

Answer 3

Dans votre exemple, la zone de texte fonctionne car il s'agit d'un contrôle ASP et non de la ligne de table car il s'agit d'un élément HTML.

Regardez le code HTML actuel et assurez-vous que $('#<%= tempTR.ClientID %>').hide(); se résout à $('#tempTR').hide(); dans le rendu HTML.

Je n'ai pas utilisé ASP depuis longtemps, mais je crois que ce sera le rendu $('#tempTR.ClientID') qui n'est pas un ID dans le DOM.

Answer 4

Je préfère, tant que vous venez de cliquer sur un élément à l'intérieur du TR vous voulez cacher, je vais utiliser:

$('#other').click(function() { 
    $(this).closest("tr").hide(); 
}); 

avec un effet:

$('#other').click(function() { 
    $(this).closest("tr").fadeOut('slow'); 
}); 

se rappeler de mettre ce code dans votre fonction onReady

$(document).ready(function($) { 
    // Code using $ as usual goes here. 
}); 

Answer 5

Cela ne fonctionne pas avec une table dans Jquery ou javascript. Vous devez référencer une table par classe ou un autre identifiant. L'utilisation de l'ID d'élément ne fonctionne pas avec les tables.