Bonjour,
est t'il possible d'afficher une ou plusieurs lignes d'un tableau html à l'aide de display (ou autre) en javascript lorsque l'on click sur un lien.
Merci
Bonjour,
est t'il possible d'afficher une ou plusieurs lignes d'un tableau html à l'aide de display (ou autre) en javascript lorsque l'on click sur un lien.
Merci
as tu essayé ?
Ma page Developpez - Mon Blog Developpez
Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
Votre post est résolu ? Alors n'oubliez pas le Tag
Venez sur le Chat de Développez !
OuiEnvoyé par rdams
De rien.Envoyé par rdams
non sinon il aurais pas posé la questionEnvoyé par SpaceFrog
(vu que ce sujet tourne au troll j'en profite, en plus c'est denisC qu'a commencé)
Alunissage : Procédé technique consistant à déposer des imbéciles sur un rêve enfantin.
Cours | FAQ | Sources Javascript
Cours | FAQ | Sources PHP
Mes Articles
J'ai essayé ceci :
et sur mes <tr> je fais ceci :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8 function affichage_ligne_appli(id_ligne){ if(document.getElementById(id_ligne).style.display=="none"){ document.getElementById(id_ligne).style.display==""; }else{ document.getElementById(id_ligne).style.display="none"; } }
ca me cache une ligne lorsque je click sur le lien mais pas toute celle qui on le meme id, je voudrais aussi que les ligne soit caché au départ.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9 <tr id="t1"><td><a onClick="affichage_ligne_appli ('ligne_1')"> affiche_1</a></td></tr> <tr id='ligne_1><td>test1</td></tr> <tr id='ligne_1><td>test2</td></tr> <tr id="t2"><td><a onClick="affichage_ligne_appli ('ligne_2')"> affiche_2</a></td></tr> <tr id='ligne_2><td>test3</td></tr> <tr id='ligne_2><td>test4</td></tr> <tr id="t3"><td><a onClick="affichage_ligne_appli ('ligne_3')"> affiche_3</a></td></tr> <tr id='ligne_3><td>test5</td></tr>
PS : si je demande de l'aide c'est que je me suis renseigné avant, ce n'est pas parce qu'il n'y a pas de code source que je n'ai pas essayé.
On s"en doute, mais tant que tu ne précises pas ce que tu as déjà cherché, on ne peux rien savoir sur ton niveau....Envoyé par rdams
Sinon, pour ton code:
id doit être un identifiant unique d'un élement HTML. Tu ne dois pas avoir deux élements avec le même identifiant. Donc ça ne marche pas....
Mets leur un id avec un compteur, style ligne1_1, ligne1_2, etc...
Ensuite fais une boucle de getElementById...
deja, on ne met le meme id a differents elements ....
tu peux utiliser ca :
http://javascript.developpez.com/sou...divers#chngcss
tu met la meme class de style a tes elements et tu fais des
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2 changeRule(".taclasse","display:none");
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2 changeRule(".taclasse","");
Alunissage : Procédé technique consistant à déposer des imbéciles sur un rêve enfantin.
Cours | FAQ | Sources Javascript
Cours | FAQ | Sources PHP
Mes Articles
un exemple :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72 <html> <head> <title> mon titre </title> <style type='text/css'> .ligne_1{} .ligne_2{} .ligne_3{} </style> <script type='text/javascript'> function getRuleIndex(name){ var cmpt = 0; var index = 0; var tab = null; var good = false; while(index<document.styleSheets.length && !good){ tab = document.all ? document.styleSheets[index].rules : document.styleSheets[index].cssRules; while(cmpt<tab.length && !good){ if(tab[cmpt].selectorText.toLowerCase() == name) good = true; cmpt++; } index++; } return {sheetIndex:index-1,ruleIndex:cmpt-1}; } function changeRule(selector,cssText){ infos = getRuleIndex(selector); sheet = document.styleSheets[infos.sheetIndex]; if(document.all){ sheet.removeRule(infos.ruleIndex); sheet.addRule(selector,cssText); } else{ sheet.deleteRule(infos.ruleIndex); sheet.insertRule(selector+"{"+cssText+"}", sheet.cssRules.length); } } var lignes = new Array(); lignes["ligne_1"] = true; lignes["ligne_2"] = true; lignes["ligne_3"] = true; function affichage_ligne_appli(lig){ if(lignes[lig]) changeRule("."+lig,"display:none"); else changeRule("."+lig,"display: inherit;"); lignes[lig] = !lignes[lig]; } </script> </head> <body> <table> <tr id="t1"><td><a onClick="affichage_ligne_appli ('ligne_1')"> affiche_1</a></td></tr> <tr class='ligne_1'><td>test1</td></tr> <tr class='ligne_1'><td>test2</td></tr> <tr id="t2"><td><a onClick="affichage_ligne_appli ('ligne_2')"> affiche_2</a></td></tr> <tr class='ligne_2'><td>test3</td></tr> <tr class='ligne_2'><td>test4</td></tr> <tr id="t3"><td><a onClick="affichage_ligne_appli ('ligne_3')"> affiche_3</a></td></tr> <tr class='ligne_3'><td>test5</td></tr> </table> </body> </html>
Alunissage : Procédé technique consistant à déposer des imbéciles sur un rêve enfantin.
Cours | FAQ | Sources Javascript
Cours | FAQ | Sources PHP
Mes Articles
il me samblait qu'en principe, un display ne doit prendre que les valeurs
- block
- none
- inline
- inline-block
- list-item
- table-header-group
- table-footer-group
pas de chaine vide !
Me trompe-je ?
Il n'y a que 2 choses infinies dans le monde :
L'univers et la bétise humaine...
Mais pour l'univers, je n'ai pas de certitude (A.E.)
non tu te trompes pas, tu as juste oublié le inherit qu on peut mettre partout
Alunissage : Procédé technique consistant à déposer des imbéciles sur un rêve enfantin.
Cours | FAQ | Sources Javascript
Cours | FAQ | Sources PHP
Mes Articles
mon tableau est dynamique, donc il n'y a pas que 3 lignes.
je ne peu pas initialiser les style et le tableau en JS de facon statique.
je cherche comment compter le nombre d'element avec un id commençant par ligne1_...
avec une boucle ?
Ma page Developpez - Mon Blog Developpez
Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
Votre post est résolu ? Alors n'oubliez pas le Tag
Venez sur le Chat de Développez !
au depart je cache mes lignes, mais je n'arrive pas à les afficher voici le code :
la fonction
le html
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12 function affichage_ligne_appli(id_ligne, nb){ var id=''; for(var i=0; i<nb; i++){ id=id_ligne+'_'+i; if(document.getElementById(id).style.display=="none"){ document.getElementById(id).style.display=="block"; }else{ document.getElementById(id).style.display="none"; } } }
si je ne les cache pas (j'enleve le style="display:none"), j'arrive à les cacher mais plus à les rafficher.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9 <tr id="t1"><td><a onClick="affichage_ligne_appli ('ligne_1')"> affiche_1</a></td></tr> <tr id='ligne_1' style="display:none"><td>test1</td></tr> <tr id='ligne_1' style="display:none"><td>test2</td></tr> <tr id="t2"><td><a onClick="affichage_ligne_appli ('ligne_2')"> affiche_2</a></td></tr> <tr id='ligne_2' style="display:none"><td>test3</td></tr> <tr id='ligne_2' style="display:none"><td>test4</td></tr> <tr id="t3"><td><a onClick="affichage_ligne_appli ('ligne_3')"> affiche_3</a></td></tr> <tr id='ligne_3' style="display:none"><td>test5</td></tr>
tu as mis un == pour block ... met un simple =
Alunissage : Procédé technique consistant à déposer des imbéciles sur un rêve enfantin.
Cours | FAQ | Sources Javascript
Cours | FAQ | Sources PHP
Mes Articles
Vous avez un bloqueur de publicités installé.
Le Club Developpez.com n'affiche que des publicités IT, discrètes et non intrusives.
Afin que nous puissions continuer à vous fournir gratuitement du contenu de qualité, merci de nous soutenir en désactivant votre bloqueur de publicités sur Developpez.com.
Partager