Discussion :

[Robjerey]

Bonjour.

Pourriez-vous, s'il vous plait, m'expliquer comment faire, en JavaScript, pour lier un champ texte avec une case à cocher?
(afin que le champ Texte soit grisé (donc non éditable) lorsque que la case à cocher est décochée, et que le champ Texte soit dégrisé (donc éditable) lorsque que la case à cocher est cochée)

Merci.

[SpaceFrog]

il suffit de modifier la propriété disabled du champs,
c'est pas dans la FAQ ?

[Robjerey]

La propriété disabled du champ ne fonctionne pas.
Ci-dessous mon code HTML:

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<tr>
<th>C'est Accepté
<input name="accept" id="accept" type="checkbox" value="true"></input>
<input name="accept" type="hidden" value="false"></input>
le
<input type="text" id="acceptDate">
</th>
</tr>

Ci-dessous mon code JavaScript:

Code JavaScript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<script type="text/javascript">
    if (document.getElementById("accept").checked) // case cochée
    {
        document.getElementById("acceptDate").disabled = true;
    }
    else // sinon
    {
        document.getElementById("acceptDate").disabled = false;
    }
</script>

Pourquoi cela ne fonctionne-t-il pas?

Merci.

[Bovino]

Il peut y avoir plusieurs raisons.
Pour que ton code JavaScript fonctionne, il faut qu'il soit exécuté après que les éléments HTML en question soient insérés dans le DOM.
Ensuite, dans ce que tu écris, il n'y a aucun lien entre le fait de cocher ou décocher la case et l'activation ou non du champ. Il faut donc mettre ton code dans une fonction et appeler cette fonction lorsqu'on clique sur la case.
Enfin, ton code peut être largement factorisé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById("acceptDate").disabled = document.getElementById("accept").checked;

PS : tu as deux champs avec le même name, c'est pas terrible.