Désactiver plusieurs champs en cochant un bouton radio [Résolu]

Signaler
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007
-
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014
-
Bonjour,

je suis bloqué sur un code javascript depuis assez de temps et je suis bloquée.

Voila, j'ai 2 boutons radios (oui, non), quand la personne clique sur non, je veux que certains champs se désactivent et quand elle clique sur oui, ces champs s'activent. Malheureusement avec mon code, il n'y a que le premier champ qui se désactive et pas les autres, si quelque peut m'aider, merci

Voici mon code:

(Mon code javascript)
<script language="Javascript">
function ActivDesactiv(Controleur, Controle, Masquer) {
var objControleur = document.getElementById(Controleur);
var objControle = document.getElementById(Controle);
    if (Masquer=='1')
        objControle.style.visibility=(objControleur.checked==true)?'visible':'hidden';
    else
        objControle.disabled=(objControleur.checked==true)?false:true;
    return true;
}
</script>

(Mes 2 champs oui et non)
<form name="formpret" action="" method="post">

<label for="ouico">oui</label>

<label for="nonco">non</label>

(Les champs que je souahite désactiver)

          <select id="liste_1" name="titreco">
              <option></option>
              <option>Mr</option>
            <option>Mme</option>
            <option>Mlle</option>
          </select>

</form>

24 réponses

Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

Il faut que la fonction LockUnlockElements soit comme dans la première solution que je t'ai proposé (qu'elle prenne un paramètre..).
Le code php doit être placé après la déclaration de la fonction (en dehors des balises <script>) pour ne pas appeler une fonction pas encore déclarée.

Ensuite tu peux enlever le onload de ton champs hidden  (voire même enlever le champs si tu ne doit pas passer la valeur à la page suivante).

<script language="Javascript">
function LockUnlockElements(valeur) {
if (valeur=="on") {
document.getElementById("salairenetco").style.visibility="visible";
}
else {
document.getElementById("salairenetco").style.visibility="hidden";
}
}
</script>
<?php
echo "<script language='javascript'>LockUnlockElements('" . $_POST['ouico'] . "')</script>"; //Execution de la fonction
?>

et dans le hidden :
" />

Le hidden ne sert plus alors qu'à passer $ouico à la page suivante
Messages postés
268
Date d'inscription
lundi 9 janvier 2006
Statut
Membre
Dernière intervention
19 janvier 2017
2
Pour activer ou désactiver une liste d'éléments, j'utiliserais plutôt une checkbox à laquelle j'associerait un label avec le texte "Déverrouiller".
D'autre part, en mettant le même index ("list_1") à trois éléments différents, comment veux tu que javascript s'y retrouve!...

Celà donnerait quelque chose comme celà :
<script type="text/javascript">
function LockUnlockElements() {
  if (document.getElementById("checkLock").checked) {
     document.getElementById("checkLock").checked=false;
     document.getElementById("list_1").style.visibility="hidden";
     document.getElementById("text_nom").style.visibility="hidden";
     document.getElementById("text_prenom").style.visibility="hidden";
     }
 else {
     document.getElementById("checkLock").checked=true;

     document.getElementById("list_1").style.visibility="visible";

     document.getElementById("text_nom").style.visibility="visible";

     document.getElementById("text_prenom").style.visibility="visible";

    }
}
</script>
<form name=""formpret">

<label for="checklock">D&eacute;verrouiller</label>
 <select id="liste_1" name="titreco">
<option>Mr</option>
<option>Mme</option>
<option>Mlle</option>
</select>

</form>
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

j'ai testé ton code, il n'y a aucun changement
Messages postés
268
Date d'inscription
lundi 9 janvier 2006
Statut
Membre
Dernière intervention
19 janvier 2017
2
J'ai fait une petite coquille dans le code et il faut enlever deux lignes inutiles :
<script type= "text/javascript">
function LockUnlockElements() {
  if (document.getElementById("check l ock").checked) {
     document.getElementById("list_1").style.visibility ="hidden";
     document.getElementById("text_nom").style.visibility="hidden";
     document.getElementById("text_prenom").style.visibility="hidden";
     }
 else {
     document.getElementById("list_1").style.visibility="visible";
     document.getElementById("text_nom").style.visibility="visible";
     document.getElementById("text_prenom").style.visibility="visible";
    }
}
</script>
<form name=""formpret">

<label for="checklock">D&eacute;verrouiller</label>
 <select id="liste_1" name="titreco">
<option>Mr</option>
<option>Mme</option>
<option>Mlle</option>
</select>

</form>
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

Il marche toujours pas même si j'ai fais quelques corrections:

document.getElementById("liste_1").style.visibility="visible";

<form name=""formpret"> (à enlever)

Ou c'est moi qui voit pas ce que cela doit faire
Messages postés
268
Date d'inscription
lundi 9 janvier 2006
Statut
Membre
Dernière intervention
19 janvier 2017
2
J'ai testé ce code avec Firefox 2.0.0.3, il fonctionne :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
  <title>Test d'affichage</title>

<script type="text/javascript">
function LockUnlockElements() {
if (document.getElementById("checklock").checked) {
document.getElementById("liste_1").style.visibility="visible";
document.getElementById("text_nom").style.visibility="visible";
document.getElementById("text_prenom").style.visibility="visible";
}
else {
document.getElementById("liste_1").style.visibility="hidden";
document.getElementById("text_nom").style.visibility="hidden";
document.getElementById("text_prenom").style.visibility="hidden";
}
}
</script>
</head>

<form name="formpret">

<label for="checklock">D&eacute;verrouiller</label>
<select id="liste_1" name="titreco">
<option>Mr</option>
<option>Mme</option>
<option>Mlle</option>
</select>

</form>

</html>
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

Merci beaucoup, ca marche comme ca.
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

Re,

je voudrais savoir autre chose. Mon formulaire est en plusieurs étapes et je souhaite que lorsque je décoche ou coche la checkbox, que dans les autres pages ca se "mémorise" pour que les champs apparaissent ou pas selon le cas .
Messages postés
268
Date d'inscription
lundi 9 janvier 2006
Statut
Membre
Dernière intervention
19 janvier 2017
2
Il y a bien les cookies utilisées à partir d'un script client (à ce sujet consulter le site suivant http://www.w3schools.com/js/js_cookies.asp).
Pour ma part j'utilisait beaucoup les cookies dans des scripts coté serveur (ASP), aujourd'hui je conseillerais les scripts PHP qui sont beaucoup plus universels. En tous cas, l'utilisation des scripts pour créer des cookies est nettement plus aisée coté serveur que coté client.
Le plus simple serait d'utiliser des frames et de conserver les éléments à utiliser sur plusieurs pages dans un frame apparaissant dans chacune de ces pages.
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

Si tu fais du php (enfin j'imagine que ça existe aussi dans les autres langages) tu peux utiliser des sessions. Ca évite d'avoir des problèmes si le client n'autorise pas les cookies, et la session est détruite quand on ferme le navigateur...
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

Alors j'ai fais autrement mais je ne trouve pas l'évenement qu'il faut.

En fait, dans la seconde page j'ai récupéré la valeur de la checkbox et je l'ai incorporé dans un champ caché mais malheureusement je ne trouve pas l'évènement et je sais pas si c'est possible.

(Je récupère la valeur)
<?
    $ouico=$_POST['ouico'];
?>

(Le code javascript)
<script language="Javascript">
function LockUnlockElements() {
if (document.getElementById("ouico2").value=="on") {
document.getElementById("salairenetco").style.visibility="visible";
}
else {
document.getElementById("salairenetco").style.visibility="hidden";
}
}
</script>

(Je la mets dans un champ caché)
<form name="formpret" action="" method="post">
 " OnLoad="LockUnlockElements()" />

(Le champ que je souhaite masquer si ouico2 n'est pas pas egal à on)

</form>
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

Ben là du coup je vois pas...


Essaye peut-être de remplacer value="<?$ouico?>" par value="<? echo $ouico; ?>" mais ça m'ettonerais

Sinon je vois 2 trucs que tu pourrais essayer (sans conviction) :

1)
<script language="Javascript">
function LockUnlockElements(valeur) {
if (valeur=="on") {
document.getElementById("salairenetco").style.visibility="visible";
}
else {
document.getElementById("salairenetco").style.visibility="hidden";
}
}
</script>

et dans le champs caché :
" OnLoad="javascript:LockUnlockElements(this.value);" />

2)
<?php
echo "<script language='javascript'>LockUnlockElements('" . $_POST['ouico'] . "')</script>";
?>

pour forcer l'exécution de la fonction avec la bonne valeur (au cas ou le problème viendrait du OnLoad (que tu peux dans ce cas supprimer.

J'espère que ça pourra t'aider...
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

Merci beaucoup.

La première solution ne fonctionne pas mais je comprend pas pour la seconde où il faut le mettre et que dois-je enlever, que dois-je modifier?
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

Je te remerci vraiment de ton aide mais aucune des 2 solutions ne fonctionnent.
Pourtant quand je fais un echo de $ouico, ca me retourne "on" si la checkbox a été cochée dans la page précédente et ce ne me retourne rien si elle a été décochée. Je sais pas d'où vient le problème, je pense que le onload ne fonctionne pas.
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

Quel es le problème exactement? Erreur javascript, PHP,...?
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

Bien rien ne se passe. Je veux que ca fasse comme sur la premiere page, c'est a dire que lorsque la checkbox est décochée ca désactive des champs. Dans le seconde page, je récupère la valeur de la checkbox mais rien ne se passe, les champs ne se désactivent pas. En gros je crois que le code javascript ne se lit pas, mon champs salairenetco ne se désactive pas.
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

Il faudrait peut etre essayer de voir si $_POST['ouico'] existe et si il contient quelque chose. C'est assez strange les checkbox. Tu teste peut etre une valeur qui n'existe pas.
dans ce cas un truc du genre
<?php
if (empty($_POST['ouico'])) $ouico = "off";
else $ouico = $_POST['ouico'];
?>
pourrait arranger les choses.

Essaye d'afficher $_POST['ouico'] en ayant coché et sans avoir coché, pour voir si ça marche dans tous les cas...
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

Oui oui $_POST['ouico'] existe, il contient on(coché) et off(décoché), je continus à croire que le code js n'est pas lu, je remet tout mon code:

<?php
if (empty($_POST['ouico'])) $ouico = "off";
else $ouico = $_POST['ouico'];
?>

<script language="Javascript">
function LockUnlockElements(valeur) {
if (valeur=="on") {
document.getElementById("salairenetco").style.visibility="visible";
}
else {
document.getElementById("salairenetco").style.visibility="hidden";
}
}
</script>

<?php
echo "<script language='javascript'>LockUnlockElements('" . $ouico . "')</script>";
?>

<form name="formpret" action="" method="post">
            " />
           

</form>
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

Pour savoir si la fonction est exécutée, place un alert (valeur); au tout début (avant if (valeur=="on") {)

Tu saura comme ça si la fonction est executée et si oui quelle est la valeur qu'elle teste...
Messages postés
15
Date d'inscription
mercredi 18 avril 2007
Statut
Membre
Dernière intervention
2 mai 2007

Bein pour la checkbox coché, ca met on et pour la checkbox décochée ca met off