Afficher/masquer un DIV et/ou tout afficher/masquer.

Petit nouveau ! | 1 Messages

12 mars 2010, 11:58

Bonjour,
je viens de résoudre des gros problèmes grâce à l'aide que j'ai pu trouver dans le tutoriel Sujet: Afficher/masquer un DIV et mémoriser son état en Javascript
Merci beaucoup.
Mais il y a encore une chose que je n'arrive pas à faire : c'est avoir un bouton "afficher / masquer tout" mais qui laisserait afficher les titres. Dans cet exemple cela donnerait lorsque l'on cache tout :
Afficher / masquer div A
Afficher / masquer div B
Afficher / masquer div C
Afficher / masquer div D
Afficher / masquer div E

et lorsque l'on affiche tout :
Afficher / masquer div A
AAAAAAAAAAAAA
Afficher / masquer div B
BBBBBBBBBBBBB
Afficher / masquer div C
CCCCCCCCCCCCC
Afficher / masquer div D
DDDDDDDDDDDDD
Afficher / masquer div E
EEEEEEEEEEEEEEEEE

Merci d'avance.

Petit nouveau ! | 6 Messages

16 mars 2010, 17:48

Salut !

pour ça

Code : Tout sélectionner

document.getElementById("tadiv").style.display="block" // pour afficher document.getElementById("tadiv").style.display="none" // pour masquer
tu peu te créer une fonction javascript du style

Code : Tout sélectionner

function affichetout() { document.getElementById("tadiv1").style.display="block" document.getElementById("tadiv2").style.display="block" document.getElementById("tadiv3").style.display="block" }
et l'inverse pour masquer

Code : Tout sélectionner

function masquetout() { document.getElementById("tadiv1").style.display="none" document.getElementById("tadiv2").style.display="none" document.getElementById("tadiv3").style.display="none" }


En optimisant le code ça pourrait donner

Code : Tout sélectionner

function affichetout(nbdiv) { for(i=0;i<nbdiv;i++) { document.getElementById("tadiv"+i).style.display="block" } }

Code : Tout sélectionner

function masquertout(nbdiv) { for(i=0;i<nbdiv;i++) { document.getElementById("tadiv"+i).style.display="none" } }

ViPHP
AB
ViPHP | 5818 Messages

16 mars 2010, 23:25

Oui c'est le principe mais la fonction dont il parle en lien, mémorise l'état d'affichage dans un cookie, et chaque div doit pouvoir également être afficher/masquer individuellement.

Pour cette raison et éviter de multiplier les cookies j'enregistre les valeurs dans un tableau sérialisé envoyé dans un seul cookie par page.

Au passage les fonctions de sérialisation étant compatibles php cela permet de récupérer facilement les valeurs d'affichage des div en php.

De plus le principe de fonctionnement initial est d'avoir un seul bouton qui inverse l'état d'affichage et non pas deux, ce qui simplifierait effectivement beaucoup les choses :wink:


Donc pour compléter le code précédent, j'ai défini le fonctionnement suivant :

- Quand on clique sur le bouton pour afficher/masquer un bloc de div, on mémorise l'état du bouton (ex : afficher)

- Au prochain clic, on inverse l'état du bouton (ex : masquer), excepté si les div ont été modifiés individuellement et ont déjà tous l'état inverse (ex : masquer). Dans ce cas le bouton garde son état initial (ex : afficher) pour éviter un clic inutile.

La fonction que j'ai créée pour ce faire étant à intégrer dans le code initial, je vous donne rendez-vous sur le lien suivant.