Forum d'entraide PHPFrance

Bonjour,

Je suis en pleine réalisation d'un formulaire et j'ai développé une fonction javascript me permettant d'afficher/cacher un DIV donné mais il s'avère que je rencontre un petit bug.

Voici la fonction :

Code : Tout sélectionner

function Form_HideShowDiv (id_hide, id_hideshow) {
	 var baliseHide = document.getElementById(id_hide);
	 var baliseHideShow = document.getElementById(id_hideshow);

	 if (baliseHide.style.display == "block") {
	 baliseHide.style.display = "none";
	 }
	
	 if (baliseHideShow.style.display == "none") {
	 baliseHideShow.style.display = "block";
	 } else
	 baliseHideShow.style.display = "none";
	 }

J'appelle la fonction comme suit (dans un echo PHP) :

Code : Tout sélectionner

echo '<input type="radio" name="video_local" value="true" id="videolocal_0" onClick="javascript:Form_HideShowDiv(\'flickr\',\'watermark\')" />';

Comme dans l'exemple d'appel ci-dessus, la fonction marche très bien.
Elle ferme le DIV "flickr" et ouvre le DIV "watermark".

Par contre, j'aimerai que ma fonction marche aussi comme ceci :

Code : Tout sélectionner

javascript:Form_HideShowDiv(' ','page_descr')

Comme vous le remarquez je désirerai laisser vide l'appel de la première ID du DIV (car j'en ai pas besoin) et appeler seulement la second ID DIV.
Pour avoir une seule et même fonction qui fait tout.

Pour rappel, la première ID DIV que j'appelle détecte si display=block et le met en display=none.
la seconde ID DIV détecte si le DIV en question est display=none et le met en display=block et inversément.

Mais là je bloque ...
Que dois-je modifier dans ma fonction (ou dans l'appel) pour que ça marche ?

Par la même occasion, si vous avez une astuce pour rendre le code javascript plus propre, je suis preneur

Merci,
raph

Salut,

J'ai résolu mon problème comme ceci :

[javascript]
<script type="text/javascript">

function Form_HideShowDiv (check_id, id_hide, id_show) {

// si id_hide n'est pas vide, on cache le DIV qui correspond à id_hide
// On vérifie également su le bouton (radio ou checkbox) est coché

if(id_hide) {
var baliseHide = document.getElementById(id_hide);

if (baliseHide.style.display == "block" && document.getElementById(check_id).checked == true) {
baliseHide.style.display = "none";
}
}

// Si id_show n'est pas vide, on teste si le style.display est none ou block et on affiche ou cache le DIV correspondant à id_show
// On vérifie également su le bouton (radio ou checkbox) est coché

if(id_show) {
var baliseShow = document.getElementById(id_show);

if (baliseShow.style.display == "none" && document.getElementById(check_id).checked == true) {
baliseShow.style.display = "block";
} else if (baliseShow.style.display == "block" && document.getElementById(check_id).checked == false) {
baliseShow.style.display = "none";
}
}
}
</script>
[/javascript]

L'appel se fait :

Code : Tout sélectionner

onClick="javascript:Form_HideShowDiv(this.id,'watermark','flickr')"

Mais le code ne me parait pas très propre. Comment puis-je l'améliorer ?

Merci,
raph

Forum d'entraide PHPFrance

Hide / Show DIV pour formulaire

Hide / Show DIV pour formulaire

Re: Hide / Show DIV pour formulaire