Sauvegarder l'état d'un élément (sur un show/hide)

Version imprimable

Bonjour à tous,

J'utilise une fonction pour afficher/cacher des divs et j'aurais voulu que le dernier état connu (ouvert ou fermé) soit sauvegardé en mémoire. Comment puis-je faire svp?

pour info j'utilise une fonction de Show/Hide du type :
Code:

1 2 3 4 5 6 7 8 9 10 11 function showHide(divId) { if (document.getElementById(divId).style.display=="none") { document.getElementById(divId).style.display="inline"; } else { document.getElementById(divId).style.display="none"; } }
merci d'avance pour votre aide!

29/05/2009, 08h23
andry.aime

Salut,

Citation:

j'aurais voulu que le dernier état connu (ouvert ou fermé) soit sauvegardé en mémoire.

Tu veux le sauvegarder lors de la session? Utilise un cookie.
Si tu veux le sauvegarder dans une base, utilise ajax.
29/05/2009, 11h06
frakosun

bonjour andry!Merci pour ta réponse.

En fait je pensais sauvegarder l'état de la session en cours, donc utiliser un cookie. Ma question était mal posée, en fait je vois pas trop comment le rajouter dans la fonction...

un truc du style "onClick="setcookie()" avant l'appel de la fonction dans la balise <a...> ou en ajoutant le setcookie directement dans la fonction show/hide?
29/05/2009, 11h14
andry.aime

Tu ajoute directement le setcookie dans la fonction showhide.
29/05/2009, 11h22
frakosun

ok merci je vais essayer de faire ça,je reviens une fois que ça marche :)

Voilà

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
var state;
window.onload=function() {
obj=document.getElementById('contenu'); //Nom de la zone à afficher/cacher
state=(state==null)?'cache':state; //On cache par défaut
obj.className=state;
 
document.getElementById('sh').onclick=function() { //Lien du Show/hide
obj.className=(obj.className=='aff')?'cache':'aff';
state=obj.className;
setCookie();
return false;
}
}
 
function setCookie() {
document.cookie='State='+state;
}
 
function readCookie() {
if(document.cookie) {
state=document.cookie.split('State=')[1];
}
}
readCookie();

sans oublier le code CSS :

Code:

1
2
3
4
5
6
.cache {
display:none;
}
.aff {
display:block;
}

et pour ceux qui voudraient faire pareil avec la fonction toggle de JQUery, un petit tuto est dispo ici :
http://ifohdesigns.com/blog/tutorial...e-with-cookies