Afficher/Masquer élément au chargement dans un formulaire dynamique
Bonjour,
Je me tourne vers vous car je cherche en vain une solution à mon problème...
J'ai un formulaire généré de cette manière:
Code:
1 2 3 4 5 6 7 8 9 10
|
foreach($tab as $key=>$val)
{
echo '<select name="'.$key.'" onChange="autre(this,\''.$key.'\')">';
foreach($val as $cle=>$donnee)
{
echo '<option value="'.$donnee.'">'.$donnee.'</option>';
}
echo '</select><input type="text" name="autre_'.$key.'" id="autre_'.$key.'" class="hide"/>';
} |
En gros on obtient une succession de select qui ont cette forme :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
|
<select name="nom" onChange="autre(this,'nom')">
<option value="dupont">Dupont</option>
<option value="dubois">Dubois</option>
<option value="Autre">Autre</option>
</select>
<input type="text" name="autre_nom" id="autre_nom" class="hide"/>
<select name="prenom" onChange="autre(this,'prenom')">
<option value="jean">Jean</option>
<option value="paul">Paul</option>
<option value="Autre">Autre</option>
</select>
<input type="text" name="autre_prenom" id="autre_prenom" class="hide"/>
... |
Lorsque l'on sélectionne "Autre", le input type text apparait grâce à ma fontion autre()
Code:
1 2 3 4 5 6 7 8 9 10 11 12
|
function autre(select,nom)
{
if(select.options[select.selectedIndex].value == "Autre")
{
document.getElementById('autre_'+nom).style.visibility = 'visible';
}
else
{
document.getElementById('autre_'+nom).style.visibility = 'hidden';
}
} |
CSS de l'input
Code:
1 2 3 4 5
| .hide
{
visibility:hidden;
width:300px;
} |
Ça ça fonctionne pas de soucis. Le problème c'est que lorsque l'on a sélectionné "Autre" et que l'on recharge la page (F5) avant d'avoir validé le formulaire et bien le champ input est de nouveau caché => css
Est-ce qu'il existerait un moyen de contrôler tous les select au chargement de la page pour faire apparaitre les champs "Autre" étant donné que le nombre de select est variable et leur id également (autre_'.$key') ? Ou bien alors une autre solution pour éviter que les champ disparaissent au rechargement de la page ? Merci d'avance.