Javascript cacher des lignes d'un tableau html

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Javascript cacher des lignes d'un tableau html

Re: Javascript cacher des lignes d'un tableau html

par bdbdfb » 28 sept. 2011, 18:34

Merci pour le post ;)
Merci, je posterait ce que j'ai fait lundi ca l'air de fonctionner

Merci

par guigui69 » 09 janv. 2009, 19:39

Merci, je posterait ce que j'ai fait lundi ca l'air de fonctionner

Merci

guigui69

par AB » 09 janv. 2009, 02:31

Cela dit si tes id sont incrémentés + 1 pour chaque ligne tu peux faire simplement

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Document sans titre</title> <style type="text/css"> .cache{ display:none; } </style> <script type="text/javascript"> function affiche(i) { var i = (typeof i == 'number')? i : 0; var id = 'nom_scritere_'+i; if (this.tr = document.getElementById(id)) { this.tr.style.display = 'inline'; i++; affiche(i); } } </script> </head> <body> <table> <tr><td>Permière ligne</td></tr> <tr id="nom_scritere_1" class="cache"><td>Deuxième ligne qui apparaîtra onclick sur le bouton</td></tr> <tr><td>Troisième ligne</td></tr> <tr id="nom_scritere_2" class="cache"><td>Quatrième ligne qui apparaîtra onclick sur le bouton</td></tr> <tr><td>Cinquième ligne</td></tr> </table> <input type="button" value="fait apparaître les lignes cachées" onclick = "affiche(1)"/> </body> </html>
La fonction s'arrête dès que l'id en cours ou suivant n'existe pas.
Ici j'ai passé 1 comme argument dans l'appel onclick à la fonction affiche() puisque j'ai commencé l'incrémentation des lignes à 1 et que j'ai défini var i = 0 par défaut dans cette même fonction.

par AB » 09 janv. 2009, 01:51

Effectivement getElementsByClassName est un peu avant gardiste puisqu'il vient juste d'être implémenté dans safari et peut être firefox mais IE attendra la version 8.

Donc la piste className ne t'apportera rien de plus dans ce cas que document.getElementById(id).style.display = 'none' :cry:

par guilt92 » 08 janv. 2009, 13:08

Oups désolé j'avais lu un peu vite et j'avais vu un getElementById alors que c'est getElementsByClassName que tu utilises... Cette fonction n'existe pas d'ailleurs à ma connaissance... Qu'est ce ? Ca donne quoi avec un getElementById à la place ?

par guigui69 » 08 janv. 2009, 12:50

même en rajoutant un paramètre a display il me retourne toujours

Code : Tout sélectionner

document.getElementsByClassName(test).style is undefined document.getElementsByClassName(test).style.display = 'block';

par guilt92 » 08 janv. 2009, 11:57

Bonjour,

Il faut que tu spécifies une valeur à display, pas vide

Exemple :

document.getElementsByClassName(test).style.display = 'block';

Après si c'est dans un tableau ca peut etre différentes valeurs, inline-table ou table-row par exemple...

Les différentes valeurs possible ici

par guigui69 » 08 janv. 2009, 10:44

Oups En fait c'est l'inverse.


Je les ai tous mis en cacher au depart et je voudrait les montrer:

Code : Tout sélectionner

function check_selection(id_qt_audit) { test= id_qt_audit; alert('test='+test); //document.getElementById(test+'['+#+']').style.display == ''; (1) alert('document.getElementsByClassName('+test+').style.display = \''); document.getElementsByClassName(test).style.display = ''; }

error:

Code : Tout sélectionner

document.getElementsByClassName(test).style is undefined [Break on this error] document.getElementsByClassName(test).style.display = '';
Quand je fait alert (1) il me mets bien "document.getElementsByClassName('+ICI le nomdu trconcerné+').style.display = \''.

Quel erreur est-je commis dans mon code?

Merci

guigui69

par AB » 07 janv. 2009, 20:11

Pour cacher un objet identifié par un id La bonne syntaxes est

Code : Tout sélectionner

document.getElementById('test').style.display = 'none';
Dans ton cas défini plutôt une class pour tes lignes à cacher et utilise ensuite ClassName en JS pour les cacher.

Javascript cacher des lignes d'un tableau html

par guigui69 » 07 janv. 2009, 18:23

Bonjour à tous,

je voudrais savoir quel méthode je doit utiliser pour cacher une ligne de mon tableau (tr)
(http://www.phpfrance.com/forums/voir_reponse-274976.php)
j'ai attribué un id au tr (exemple: nom_scritere_$nb)

je voudrait savoir en javascript il possible de faire de changer le style:display dans tout les ID nom_scritere_XX (correspond a un nombre que ne connait pas).

Code : Tout sélectionner

function check_selection(id_qt_audit) { test= id_qt_audit; alert('test='+test); document.getElementById(test+'['?????']').style.display == ''; }
Ou bien exits-il une autre technique pour cacher les lignes d'un tableau?
Merci d'avance

guigui69