Jquery pour cacher le contenu des cellules d'un tableau

Question

J'ai un tableau qui se présente comme suit :

<table>
  <tr>
    <td>checkbox</td>
    <td>text-text-text</td>
    <td>dropdownlist</td>
    <td>textbox</td>
  </tr>
</table>

J'essaie de faire basculer la visibilité de la liste déroulante et de la zone de texte en fonction de l'état de la case à cocher. J'ai mis en place un événement de clic qui le fait correctement, mais il ne maintient pas la visibilité des lignes lorsque de nouvelles données sont chargées. Comment puis-je faire cela avec Jquery ?

Edit : C'est la fonction qui est connectée à l'événement click sur la case à cocher. Elle fait basculer la visibilité des éléments correctement. Le problème que je rencontre est de faire en sorte que les nouvelles lignes chargées à partir de la base de données commencent avec la bonne visibilité. (J'utilise un contrôle répétiteur en asp.net pour construire la table, donc je passe les ID des clients dans la fonction).

Simplifié : J'ai un tableau avec une case à cocher dans la première cellule de chaque ligne. Quel sélecteur jquery dois-je utiliser pour obtenir le contenu des autres cellules de cette ligne, à partir de la case à cocher.

 function ToggleVisibility(position, hometown, state, checkbox, name, license) {
        if ($("#" + checkbox)[0].checked) {
            $("#" + position).css('visibility', 'visible').fadeIn('slow');
            $("#" + hometown).css('visibility', 'visible').fadeIn('slow');
            $("#" + state).css('visibility', 'visible').fadeIn('slow');
            $("#" + name).css('font-weight', 'bold');
            $("#" + license).css('font-weight', 'bold');
        }
        else {
            $("#" + position).css('visibility', 'hidden').fadeOut('slow');
            $("#" + hometown).css('visibility', 'hidden').fadeOut('slow');
            $("#" + state).css('visibility', 'hidden').fadeOut('slow');
            $("#" + name).css('font-weight', 'normal');
            $("#" + license).css('font-weight', 'normal');
        }
}

Answer 1

La seule façon d'y parvenir est d'utiliser Ajax pour conserver l'état mis à jour sur le serveur. Par exemple :

<input type="checkbox" id="cb1" class="save">

avec :

$(":checkbox.save").click(function() {
  $.post('/save.php', {id: this.id, checked: this.checked});
  $("rowid").toggle(this.checked);
});

Ensuite, lorsque le serveur rend la page, il peut interroger l'état persistant de la page et rendre les contrôles et les lignes correctement.

Answer 2

Vous pouvez jeter un coup d'œil à livequery, qui est un plugin pour jquery : Livequery

Answer 3

Placez les éléments que vous souhaitez masquer dans un DIV et masquez le DIV, pas la cellule du tableau.