Cómo deshabilitar una casilla en HTML para que aparezca grisada
ekatte
-
ekatte -
ekatte -
Bonjour,
J’ai un problème en html !
J’ai créée un menu déroulant qui donne tout les barreaux du Nord concernés et une zone de texte pour des personnes venant d’autres barreaux, bref !
J’aimerais pouvoir faire en sorte que la personne utilisant le formulaire ne puisse choisir que l’une des 2 options:
Voila mon bout de code:
<BR>Barreau : <BR>
<SELECT><OPTION></OPTION>
<OPTION>Valenciennes</OPTION>
<OPTION>Lille</OPTION>
<OPTION>Cambrai</OPTION>
<OPTION>Douai</OPTION>
<OPTION>Péronne</OPTION>
<OPTION>Arras</OPTION>
<OPTION>Saint-Quentin</OPTION>
<OPTION>Avesnes-sur-Helpe</OPTION>
</SELECT>
<INPUT TYPE="radio" NAME="radiobutton" VALUE="Autre">
Autre, précisez : <INPUT TYPE="text" NAME="texte" SIZE="10"<BR>
J’aimerais pouvoir griser la partie "Autre, précisez" si l’utilisateur choisit le menu deroulant, inversement, j’aimerais que l’utilisateur ne puisse pas ecrire ds la partie "Autre, précisez" si il choisit une des villes proposées.
Est-ce quelqu'un pourrait m'aider ?
Merci a tous d'avance !
Emma
Configuration: Windows XP Internet Explorer 7.0
J’ai un problème en html !
J’ai créée un menu déroulant qui donne tout les barreaux du Nord concernés et une zone de texte pour des personnes venant d’autres barreaux, bref !
J’aimerais pouvoir faire en sorte que la personne utilisant le formulaire ne puisse choisir que l’une des 2 options:
Voila mon bout de code:
<BR>Barreau : <BR>
<SELECT><OPTION></OPTION>
<OPTION>Valenciennes</OPTION>
<OPTION>Lille</OPTION>
<OPTION>Cambrai</OPTION>
<OPTION>Douai</OPTION>
<OPTION>Péronne</OPTION>
<OPTION>Arras</OPTION>
<OPTION>Saint-Quentin</OPTION>
<OPTION>Avesnes-sur-Helpe</OPTION>
</SELECT>
<INPUT TYPE="radio" NAME="radiobutton" VALUE="Autre">
Autre, précisez : <INPUT TYPE="text" NAME="texte" SIZE="10"<BR>
J’aimerais pouvoir griser la partie "Autre, précisez" si l’utilisateur choisit le menu deroulant, inversement, j’aimerais que l’utilisateur ne puisse pas ecrire ds la partie "Autre, précisez" si il choisit une des villes proposées.
Est-ce quelqu'un pourrait m'aider ?
Merci a tous d'avance !
Emma
Configuration: Windows XP Internet Explorer 7.0
4 respuestas
-
sería necesario usar un javascript (atención, como hace mucho que no lo hago, hará falta que alguien confirme mi respuesta)
a colocar entre las etiquetas <head> y </head><script language="javascript"> /*Primero vamos a verificar si se ha seleccionado un elemento del menú desplegable, a partir de ahí determinaremos si la textbox debe o no estar atenuada*/ function option_selectionnee(){ if(Valanciennes.selected || Lille.selected || Cambrai.selected || Douai.selected || Péronne.selected || Arras.selected || Saint-Quentin.selected || Avesnes-sur-Helpes.selected){ var champ_autre_actif = true; } else { var champ_autre_actif = false; } return champ_autre_actif } /*Esta función es simple, usa el valor devuelto por la función option_selectionnee y luego comprueba el valor. si es verdadero entonces se atenúa, si no, se mantiene como está.*/ function griser (){ if(champ_autre_actif=true){ radiobutton.enable=false; texte.enable=false; } }
Luego hay que colocar en el código html<BR>Barreau : <BR> <SELECT onclick="griser()"><OPTION></OPTION> <OPTION>Valenciennes</OPTION> <OPTION>Lille</OPTION> <OPTION>Cambrai</OPTION> <OPTION>Douai</OPTION> <OPTION>Péronne</OPTION> <OPTION>Arras</OPTION> <OPTION>Saint-Quentin</OPTION> <OPTION>Avesnes-sur-Helpe</OPTION> </SELECT>
Como te dije, no sé si está bien, por mi parte nunca hice un script para esa función, podría haber cometido grandes errores (en caso contrario, ¿entonces está perfecto, no?) y alguien podría decir la respuesta correcta en breve.
Por cierto, te aviso: no sirve de nada volver a enviar un mensaje dentro de media hora, no cambia nada, y encima da la impresión de que alguien ya te respondió. -
Hola artragis,
¡Gracias por tu respuesta! (por cierto, es raro, ¡la página está cortada y no veo todo lo que escribiste! o.O
Sí, siento haber insistido tan rápido, era solo para que mi mensaje no se fuera al olvido ^^
De todos modos probé tu trozo de código pero desafortunadamente no funciona...
Pero he entendido el principio y voy a intentar trabajarlo de nuevo ahora, ¡muchas gracias otra vez por tu ayuda!!)-
¡Ya está! encontré la solución:
<script language="javascript">
/* creación de una función relacionada con el menú desplegable de la barra */
function choix_barreau()
{
if (Valenciennes.selected || Lille.selected || Cambrai.selected || Douai.selected || Péronne.selected ||
Arras.selected || Saint-Quentin.selected || Havesnes-sur-Helpes.selected)
{
var champ_barreau_autre=true; /*si se selecciona alguna de estas ciudades, entonces la variable es verdadera */
}
else
{
var champ_barreau_autre=false; /* de lo contrario la variable es falsa */
}
return champ_barreau_autre;
}
/* creación de una función que «desactiva» la parte “Autre, précisez” */
function griser_barreau()
{
if (champ_barreau_autre=true)
{
document.getElementById('radiobutton').disabled=true; /* si la variable tiene el valor verdadero, el botón
no puede ser seleccionado */
document.formulaire.barreau_autre.disabled=true; /* y la parte de “texto” no se activa */
}
}
</script>
y a nivel del menú desplegable puse:
<SELECT onchange="griser_barreau()">
<OPTION>******</OPTION>
<OPTION>******</OPTION>
</SELECT>
<INPUT TYPE="radio" ID="radiobutton" VALUE="Autre" SIZE="20">
En realidad hay que usar ONCHANGE y no ONCLICK.
Pequeña info para quienes como yo buscan cómo desactivar una casilla en HTML, el ONCHANGE se activa desde que hay un cambio de estado, mientras que el ONCLICK es más adecuado para un botón.
¡Gracias artragis por tu ayuda!
Por otro lado, este método no es perfecto ya que en este caso particular solo hay un botón de radio, pero con varios (como tengo más adelante en mi programa) se puede hacer clic en los otros botones de radio, excepto el que está deshabilitado (con la casilla de texto junto a él)
Otro pequeño problema: una vez desactivada la casilla, es imposible cambiar su estado sin recargar la página.......>.<
¡Busco solución!
-
-
-
basta entonces usar getElementbyId("id de tu radio botón"); eso bastará.
De nada, sabía que estaba por ahí, pero para mí JS ya hace tiempo que no lo toco.-
Para el problema de la selección de varios botones de radio he encontrado mi problema: me había olvidado o puesto de más (no recuerdo exactamente) un
"onchange="griser_barreau()"
Por otro lado, aún no encuentro una solución respecto al acceso a la casilla "grisée" si por mala suerte se ha activado !! ;p
También tengo otro pequeño problema.... si alguien tiene la amabilidad de ayudarme!^^
El siguiente: En mi formulario, si el usuario no introduce un código postal, la página le pide que introduzca uno, pero una vez que se introduce el código postal, la página sigue mostrando "Veuillez entre votre CP" !
Como no he contemplado la opción de un 2º código postal me gustaría que se contentara con este !! =)
Aquí va la parte de mi código respecto a ese problema:
en la página HTML ==>
<BR><I><ul>Code Postal : </ul></I><BR><INPUT TYPE="text" NAME="CodePostal" ID="codePostal_1" SIZE="1" maxlength="1" onKeyUp="passer_case_suivante(this,'codePostal_2', 1)"> <INPUT TYPE="text" NAME="CodePostal" ID="codePostal_2" SIZE="1" maxlength="1" onKeyUp="passer_case_suivante(this,'codePostal_3', 1)"> <INPUT TYPE="text" NAME="CodePostal" ID="codePostal_3" SIZE="1" maxlength="1" onKeyUp="passer_case_suivante(this,'codePostal_4', 1)"> <INPUT TYPE="text" NAME="CodePostal" ID="codePostal_4" SIZE="1" maxlength="1" onKeyUp="passer_case_suivante(this,'codePostal_5', 1)"> <INPUT TYPE="text" NAME="CodePostal" ID="codePostal_5" SIZE="1" maxlength="1"><BR>
dans la page php ==>if(empty($_GET['codePostal'])) { echo $info="Veuillez entrer votre code postal, svp.";} else { echo "Code Postal : ", $_GET['codePostal'], "<BR>"; }
J'ai essayé plusieurs solutions en vain !!
Je ne vois pas du tout où est mon erreur...
Je vous remercie d'avance pour l'attention que vous portez à mon problème !!
-