Habilitado/inhabilitado al volver atrás...

3pies · #1 (**permalink**) 10/10/2005, 08:04

Hola a todos...

Tengo un problemilla con un formulario, que hace lo siguiente (lo simplificaré, para no liarlo en exceso):

1.- Tengo 3 inputs de tipo radio, donde el usuario puede seleccionarlos (uno de los tres).
2.- Una vez seleccionado el segundo o el tercero, un input de tipo texto, queda habilitado, a través del evento onclick (por defecto está deshabilitado, ya que al entrar en la página, se carga el primer radio como marcado (este radio es el que inhabilita el que pueda editarse en el campo del input de tipo texto).
3.- Cuando se confirman los datos, se accede a otra página. Desde esta segunda página, el usuario puede confirmar los datos, o volver atrás. Si vuelve atrás, se carga automáticamente la página inicial con los radios y el input de tipo texto, quedando marcado el radio que previamente habíamos seleccionado.

Hasta aquí, todo queda aparentemente correcto, pero claro, como no se ha ejecutado el evento onclick, el input de tipo texto queda inhabilitado (contiene el dato tipeado anteriormente, cuando el usuario lo puso), pero atenuado, vamos, que está deshabilitado.

Ahí va la pregunta: ¿cómo podría hacer que ese campo estuviese habilitado?. Creo que no existe un evento "onchecked", pero lo que busco es algo similar a eso. Vamos, que si el radio 2 o el 3 están seleccionados (con la vuelta atrás para volver al form), que el input de texto quede habilitado.

Me estoy comiendo el coco, y no tengo ni idea de por donde pueden ir los tiros (supongo que esto es debido en gran parte, a que de javascript sé nada o menos que nada).

Gracias miles!.

PD: El input de texto se inhabilita con disabled (no con readonly).

leoj90 · #2 (**permalink**) 10/10/2005, 08:58

??

JavierB · #3 (**permalink**) 10/10/2005, 08:59

Hola 3pies

A ver si te he entendido bien:

Código PHP:

  <body onload = "document.forms[0]['txt'].disabled = document.forms[0]['r1'][0].checked">
<form>
<input type="radio" name="r1" />
<input type="radio" name="r1" />
<input type="radio" name="r1" />
<input type="text" name="txt" disabled="disabled" />
</form>

Saludos,

3pies · #4 (**permalink**) 10/10/2005, 09:15

Gracias tocayo.

Mmmmm, creo que eso no deshabilita el input ¿no?. Al menos a mí no me funciona, y tengo el input de texto siempre habilitado (aparte de que no me sale chequeado ningún radio).

Intento aclararlo un poco:
Tengo tres radios (como en tu ejemplo), y con dos de ellos, se deshabilita el input de texto (a través del evento onclick). Si relleno el input de texto, y pulso un botón -llamémosle "continuar"-, al pasar a la página siguiente, el usuario puede volver atrás para rectificar los datos. Si vuelve a esa misma página inicial, recupero el input de radio que había marcado (suponamos que si había marcado inicialmente el 2, pues sale marcado el 2). Ahora bien, como no se ha ejecutado el evento onclick, el input de texto, aparece atenuado (inhabilitado), pero con el dato que el usuario había introducido. Para poder editar esa entrada en el input de texto, debe cliequear de nuevo en algun de los dos radios (el 2 que ya estaba marcado, o el 3).

¿Se os ocurre algo, sobre como solventar este contratiempo?.

Gracias miles.

JavierB · #5 (**permalink**) 10/10/2005, 09:43

Hola de nuevo.

Me parece que no me estoy enterando del todo

¿Puedes poner el formulario que usas?

Saludos,

3pies · #6 (**permalink**) 10/10/2005, 09:48

Me has pillado fuera de juego. Estoy en el curro, y ese formulario lo tengo en casa. Mañana lo cuelgo JavierB.

Gracias por tu interés, con este desvalido :)

Myakire · #7 (**permalink**) 10/10/2005, 09:49

mmmm, así regreses a la página anterior, se vuelve a ejecutar el load de la página, ¿por qué no haces una función que en ese evento revise los estados de los checks de los radios y habilite los que ya esten seleccionados según alguna condición?

Myakire · #8 (**permalink**) 10/10/2005, 09:53

JavierB: Por si te interesa otra explicación del problema de 3pies, su único problema es que él deshabilita por código algunos controles que inicialmente estan activos, y quiere hacer un history.back y que estos vuelvan a estar activos como si la página se cargara por primera vez.

3pies · #9 (**permalink**) 10/10/2005, 09:56

Gracias Myakire. Joer, saltas más de foro, que yo, jajajajaja.

Pues verás, ...si en asp estoy un poco verde (para muestra mi última pregunta en dicho foro), en javascript, lo más que sé, es hacer un copy+paste del código de alguna página que veo por la red, jajajajaja, y poco más (muy poco más).

No tengo ni idea de como crear esa función que mire el estado de los radios chequeados...

¿Me echas otro cable con esto?. (No sé cuantas cervezas te debo ya, pero apúntame otra).

Editado: JavierB, "sastamente" lo que dice Myakire.

JavierB · #10 (**permalink**) 10/10/2005, 10:05

Hola de nuevo. (Saludos Myakire

)

A ver si lo he entendido bien. Lo que quieres es que siempre que se entre en la página, aunque sea volviendo de otra, el cuadro/s de texto esté habilitado.

Código PHP:

  <html>
<head>
<script type="text/javascript">
function habilita() {
  // Aquí pones todos los controles que quieres habilitar
  document.forms[0]['txt1'].disabled = false;
  document.forms[0]['txt2'].disabled = false;
  document.forms[0]['txt69'].disabled = false;
}
</script>
</head>
<body onload = "habilita()">

Dinos que tal te ha ido. Saludos,

3pies · #11 (**permalink**) 10/10/2005, 10:20

Gracias JavierB, aunque no es exáctamente eso lo que buscaba. Eso me habilita siempre el input de texto, pero yo quiero que me habilite el input de texto, solo si se cumple que al cargarse la página, el radio 2 o el 3, estén chequeados (recupero el estado del radio -chequeado o no-, si el usuario vuelve a esa misma página desde la página de destino, que es donde he enviado los datos del form).

Igual que existe un evento onclick que aplicado al ejemplo, me puede habilitar o no un input de texto (esto ya lo hago), quiero que al cargarse la página de nuevo (por ejemplo, porque el usuario vuelve a esa misma página, una vez ha mandado los datos del form), si detecta que el radio 2 o el 3 están chequeados, que me habilite el input de texto. Vamos, que sería algo así como un "onchecked" imaginario.

Quizás con el código de mi problema fuese más descriptivo, pero es que no lo tengo aquí. Quizás como hoy es lunes, me explico fatal. Mis disculpas.

Gracias.

Myakire · #12 (**permalink**) 10/10/2005, 12:31

Pues listo 3pies, lo que JavierB colocó te sirve perfectamente, solo agrega las condiciones de los radio, algo como:

Código:

<html>
<head>
<script type="text/javascript">
function habilita() {
  if((document.forms[0]radio[1].checked) || (document.forms[0].radio[2].checked))
  // Aquí pones todos los controles que quieres habilitar
  document.forms[0]['txt1'].disabled = false;
}
</script>
</head>
<body onload = "habilita()">

PD. Supongo que funcionará, aunque ya no estoy seguro dado que no use la sintaxis de JavierB, y es que eso de encerrar entre corchetes y apóstrofes el nombre del control (['txt1']), no lo había visto. "Zapatero a tus zapatos", jeje, mejor solo debería responder en ASP jeje

3pies · #13 (**permalink**) 11/10/2005, 03:33

Gracias JavierB y Myakire...

A ver..., he cambiado todo, pues lo que tenía funcionaba a través del evento onclick, y he aplicado vuestras sugerencias de la siguiente forma:

probatina.html

Código:

<html>
<head>
<title>Probatina</title>
<html>
<head>
<script type="text/javascript">
function habilitar() {

  if(document.forms[0].radio[0].checked)
  // Controles que no queremos habilitar
  document.forms[0]['importecomision'].disabled = true;

  if((document.forms[0].radio[1].checked) || (document.forms[0].radio[2].checked))
  // Controles que queremos habilitar
  document.forms[0]['importecomision'].disabled = false;

}
</script>
</head>
<body onload="habilitar()">
<table border="0" cellpadding="0" cellspacing="0" width="100%" align="center">
	<form action="probatina2.html" method="post" name="datos">
	<tr><td>
		<u>Comisi&oacute;n:</u><br>
		<input type="radio" name="comision" value="no" checked>No tiene<br>
		<input type="radio" name="comision" value="comisionporcentaje">Es un porcentaje sobre el principal<br>
		<input type="radio" name="comision" value="comisionfija">Es una cantidad fija
	</td></tr>
	<tr><td>
		Importe de la comisi&oacute;n: <input type="text" name="importecomision" size="10" maxlength="10">
	</td></tr>
	<tr><td>
		<input type="submit" value="Continuar" name="continuar">
	</td></tr>
	</form>
</table>
</body>
</html>

El problema es que me da error de javascript, al cargarse el evento onload, y no queda inhabilitado el input de texto al cargarse la página, o al cliquear en el primer radio botón.

Antes cuando usaba el evento onclick, me funcionaba, pero tenía la desventaja de que al pasar a la pagina siguiente (probatina2.html), y volver de nuevo atrás a la página de origen (probatina.html), como el evento onclick no se había ejecutado, pues quedaba deshabilitado el input de texto, a pesar de que el usuario hubiera cliqueado en el radio 2 o el 3.

¿Me prestais unas neuronas más?.

Gracias.

Myakire · #14 (**permalink**) 11/10/2005, 07:33

Hay que utilizar el nombre correcto del control, lo de 'radio' fue solo un ejemplo:
document.forms[0].radio[1].checked debería ser document.forms[0].comision[1].checked

Al utilizar botones de radio, generas un arreglo de estos, por ello hay que usar el subíndice.

3pies · #15 (**permalink**) 11/10/2005, 07:45

Gracias Myakire...

Madre del señor bendito...

No solo es que no había caído, sino que además no tenía ni idea, y pensaba que se podía llamar de esa forma (supongo que por aquello del input type="radio"...).

Editado:: Ahora tengo bloqueado el input, aunque seleccione los radios 2 y 3.

Este es el código:

Código:

<html>
<head>
<title>Probatina</title>
<html>
<head>
<script type="text/javascript">
function habilitar() {
  if(document.forms[0].comision[0].checked)
  // Controles que no queremos habilitar
  document.forms[0]['importecomision'].disabled = true;

  if((document.forms[0].comision[1].checked) || (document.forms[0].comision[2].checked))
  // Controles que queremos habilitar
  document.forms[0]['importecomision'].disabled = false;

}
</script>
</head>
<body onload="habilitar()">
<table border="0" cellpadding="0" cellspacing="0" width="100%" align="center">
	<form action="probatina2.html" method="post" name="datos">
	<tr><td>
		<u>Comisi&oacute;n:</u><br>
		<input type="radio" name="comision" value="no" checked>No tiene<br>
		<input type="radio" name="comision" value="comisionporcentaje">Es un porcentaje sobre el principal<br>
		<input type="radio" name="comision" value="comisionfija">Es una cantidad fija
	</td></tr>
	<tr><td>
		Importe de la comisi&oacute;n: <input type="text" name="importecomision" size="10" maxlength="10">
	</td></tr>
	<tr><td>
		<input type="submit" value="Continuar" name="continuar">
	</td></tr>
	</form>
</table>
</body>
</html>

Supongo que el error viene por cargarse en el body ¿no?.

¿Alguna sugerencia más?. Muchas gracias...

EDICION 2: la primera vez que se carga la página, no funciona. La segunda sí. Mmmmm!!!!

JavierB · #16 (**permalink**) 11/10/2005, 08:41

Hola otra vez.

Te falta el onclick de los radio para que se habilite/deshabilite el textbox. El resto creo que es correcto:

Código PHP:

  <input type="radio" name="comision" value="no" checked onclick="importecomision.disabled=true">No tiene<br>
<input type="radio" name="comision" value="comisionporcentaje" onclick="importecomision.disabled=false">Es un porcentaje sobre el principal<br>
<input type="radio" name="comision" value="comisionfija" onclick="importecomision.disabled=false">Es una cantidad fija

Saludos,

3pies · #17 (**permalink**) 11/10/2005, 08:53

Gracias JavierB. Ahora sí. Os agradezco a todos los que me habeis echado una mano, la ayuda recibida.

Ya me direis con quien tengo que hablar, para que os suban el sueldo ;)

En serio, muchas gracias.

JavierB · #18 (**permalink**) 11/10/2005, 09:06

Me alegro de que te haya funcinado. Por el sueldo no te preocupes, ya he pasado aviso a tu banco para que me haga una transferencia