Problema con un formulario

ptoledo · #1 (**permalink**) 12/11/2004, 11:34

Hola a todos les explico mi problema tengo una pagina en la cual existe un form dentro de ese form tengo dos cuadros con opciones que son excluyentes etre si ( 3 en cada cuadro de texto ), pero tienen ademas unos text box que se deben rellenar , y no se como hacerlo , como puedo incorporar un nuevo form dentro
Y como puedo hacer para que al marcar una opción las otras me queden deshabilitadas y asi mismo los textos asociados.

Se los agradeceria mucho si me pudieran ayudar.

angsanchez · #2 (**permalink**) 12/11/2004, 16:51

Hola, ptoledo
No estoy seguro de entender todo lo que quieres, pero al menos parte sería así:

1) Las opciones excluyentes se consiguen usando controles de tipo 'radio' con un mismo nombre, así:

Código HTML:

<form>
<input type="radio" name="grupoA" value="1">Opción A1 
<input type="radio" name="grupoA" value="2">Opción A2 
<input type="radio" name="grupoA" value="3">Opción A3 
 &nbsp; Escribe algo:<input type="text" name="textoA">
<br><br>
<input type="radio" name="grupoB" value="1">Opción B1 
<input type="radio" name="grupoB" value="2">Opción B2 
<input type="radio" name="grupoB" value="3">Opción B3 
 &nbsp; Escribe algo:<input type="text" name="textoB">
</form>

(También podrías ponerlas en un select.)

2) ¿Qué es exactamente lo que quieres hacer con los textbox? Para "deshabilitarlos" se puede usar una función. Por ejemplo, para deshabilitar el textbox cuando se elija la opción 3 sería:

Código HTML:

<input type="radio" name="grupoA" value="1" onClick="this.form.textoA.disabled=false">Opción A1 
<input type="radio" name="grupoA" value="2" onClick="this.form.textoA.disabled=false">Opción A2 
<input type="radio" name="grupoA" value="3" onClick="this.form.textoA.disabled=true">Opción A3

Si, además, quieres que se borre su texto, así:

Código HTML:

<input type="radio" name="grupoA" value="3" onClick="this.form.textoA.value='';this.form.textoA.disabled=true">Opción A3

Bueno, ya me dirás si eso te vale o querías otra cosa.

ptoledo · #3 (**permalink**) 13/11/2004, 15:21

Antes que todo muchas gracias por responder , me explico mejor
tengo una tabla de 3 por 3 en donde el primer recuador pertenece a un checkbox y los otros dos son casillas de texto , la ideas es que si selecciono por ejemplo 3l segundo checkbox , todos los restantes cuadros de texto que no estan asociado al numero 2 queden deshabilitado y no se puede escribir , esa es la ideas , probe con lo que me enviaste pero no me deshabilita el cuadro de texto , tu sabes como lo puedo hacer???

Saludos

Ptoledo

angsanchez · #4 (**permalink**) 13/11/2004, 16:17

Hola
Voy a mirar con tus detalles, pero con el código anterior si marcas la opción 3 debe deshabilitarse la caja de texto ¿no es así?

angsanchez · #5 (**permalink**) 13/11/2004, 16:22

A ver si esto es lo que quieres:

Código HTML:

<html>
<head>
<script language="JavaScript" type="text/javascript">
function activa(i) {
	with (document.forms[0]) {
		for (j=1;j<4;j++) {
			var cajaA = eval('texto' + j + 'A')
			var cajaB = eval('texto' + j + 'B')
			if (j==i) {cajaA.disabled = false; cajaB.disabled = false}
			else {cajaA.disabled = true; cajaB.disabled = true}
		}
	}
}
</script>
</head>

<body>
<form>
<table border=1>
<tr>
<td><input type="radio" name="grupo" value="1" onClick="activa(1)">Opción 1</td>
<td>Escribe algo:<input type="text" name="texto1A"></td>
<td>Escribe algo:<input type="text" name="texto1B"></td>
</tr>
<tr><td><input type="radio" name="grupo" value="2" onClick="activa(2)">Opción 2</td>
<td>Escribe algo:<input type="text" name="texto2A"></td>
<td>Escribe algo:<input type="text" name="texto2B"></td>
</tr>
<tr><td><input type="radio" name="grupo" value="3" onClick="activa(3)">Opción 3</td>
<td>Escribe algo:<input type="text" name="texto3A"></td>
<td>Escribe algo:<input type="text" name="texto3B"></td>
</tr>
</table>
</form>
</body>
</html>

ptoledo · #6 (**permalink**) 15/11/2004, 09:05

Gracias me resulto , pero tengo algunos problemas ,mira sabes que dentro de el cuadro tengo unas listas de opciones y no solo cuadros de texto como puedo cambiar para que eso me funcione tambien y lo pueda deshabilitar y lo otro como hago para agregar una nueva columna es decir en lugar de ser de 3 * 3 sea de 3 filas y 4 columnas , te salio un poco duro el alumno jejje

Espero no te aburras y me puedas ayudar muchas gracias

angsanchez · #7 (**permalink**) 15/11/2004, 14:47

Cita:

te salio un poco duro el alumno jejje

Pues sí...

Para poder anular varias cosas a la vez hay que ponerlas dentro de un DIV (capa), pero eso no funciona cubriendo varias celdas, así que lo que he hecho es ponerlo todo en una sola celda, a la cual se aplica el resultado de la función (la etiqueta TD hace el papel de la DIV); dentro de esa celda su pueden poner cosas sueltas, o poner una tabla para generar las columnas o filas extra que quieras (a estas tablas interiores les he puesto borde para que las veas, pero con border=0 no se notaría nada).
Fíjate que las filas 1, 2 y 3 están rellenas de modos diferentes.
Por otro lado, no he conseguido desactivar las capas, pero sí ocultarlas. Creo que queda mejor, se ve claramente que no se van a usar y además creo que no se tendrán en cuenta al enviar el formulario.

Código HTML:

<html>
<head>
<script language="JavaScript" type="text/javascript">
function activa(i) {
		for (j=1;j<4;j++) {
			var laCapa = document.getElementById('grupo'+j)
			if (j==i) { laCapa.style.visibility="visible" }
			else { laCapa.style.visibility="hidden" }
		}
}
</script>
</head>

<body>
<form>
<table border=3 cellpadding=6>
<tr>
<td><input type="radio" name="grupo" value="1" onClick="activa(1)">Opción 1</td>
<td id="grupo1">Escribe algo:<input type="text" name="texto1A"> 
Escribe algo:<input type="text" name="texto1B">
</td>
</tr>
<tr><td><input type="radio" name="grupo" value="2" onClick="activa(2)">Opción 2</td>
<td id="grupo2">
	<table border=1><tr>
	<td>Escribe algo:<input type="text" name="texto2A"></td>
	<td>Escribe algo:<input type="text" name="texto2B"></td>
	</tr></table>
</td>
</tr>
<tr><td><input type="radio" name="grupo" value="3" onClick="activa(3)">Opción 3</td>
<td id="grupo3">
	<table border=1><tr>
	<td>Escribe algo:<input type="text" name="texto3A"></td>
	<td>Escribe algo:<input type="text" name="texto3B"></td>
	</tr>
	<tr>
	<td><select name="lista3">
	<option>Elige...</option>
	<option>Rojo</option>
	<option>Azul</option>
	<option>Verde</option>
	</select></td>
	<td><input type="radio" name="radio3">Grande 
	&nbsp; 
	<input type="radio" name="radio3">Pequeño</td>
        <td><select name="lista3a">
	<option>Elige otra...</option>
	<option>Rojo</option>
	<option>Azul</option>
	<option>Verde</option>
	</select></td>
        </tr></table>
</td>
</tr>
</table>
</form>
</body>
</html>

Llegados a este punto, usar tablas es una chapucilla, habría que hacerlo todo con capas posicionadas, pero en eso no tengo práctica.

ptoledo · #8 (**permalink**) 16/11/2004, 05:56

Muchas gracias por la respuesta y la paciencia , esta vez no entendi mucho pero estoy trabajando con el codigo lo de agregar una nueva columna lo realice ayer y me resulto , para mi es un gran logro haber hecho eso kekekekek ...
Pero ahora tengo una gran duda ,mira el formulario que yo tengo lo debo guardar en una base de datos entonces se me ocurrio asignarle blancos ya que como son campos independietes , solo debo guardar uno de los 3 valores , pero mi consulta y que en eso estuve ayer , es como puedo enviarle unos blancos a las variables que quedaran deshabilitadas , y lo otro si yo asigno un blanco a una variable y despues guardo dicho formulario me resulta o estoy perdinendo el tiempo??????

Muchas pregutas jejejejej ...

Un gran Saludo y que tengas un gran día acá recien comienza para mi