[SOLUCIONADO] Desmarcar checkbox al marcar otro checkbox

fardao · #1 (**permalink**) 10/04/2013, 03:55

Buenos días amig@s,

tengo el siguiente código y por más que busco en internet cómo corregirlo no encuentro el error, alguien me puede ayudar?

Simplemente quiero desmarcar un checkbox si el otro esta activado, no se pueden utilizar los radio button, ya que estos siempre se quedan activados si el usuario selecciona uno de ellos...

Código:

<html>
<head>
<title>Test</title>

<script type="text/javascript">
	function check1(checkbox) {
		if (checkbox.checked) {
			image.src = "foto1.jpg";
			check2.checked = false;
		} 
		else {
			image.src = "foto.jpg";
		}
		}

	function check2(checkbox) {
		if (checkbox.checked) {
			image.src = "foto2.jpg";
			check1.checked = false;
		} 
		else {
			image.src = "foto.jpg";
		}
		}
</script>

<body>
	<img src="foto.jpg" id="image">
	<form name="configurador">
	<input type="checkbox"  onclick="check1(this);"> Foto 1
	<input type="checkbox"  onclick="check2(this);"> Foto 2
	</form>
</body>
</html>

Saludos y gracias de antemano

ioniben · #2 (**permalink**) 10/04/2013, 04:55

Prueba a ponerle un id al input,
<input type="checkbox" id="check1" onclick="check1(this);">
<input type="checkbox" id="check2" onclick="check2(this);"

Y en la funcion check1:
function check1(checkbox) {
if (checkbox.checked) {
image.src = "foto1.jpg";
getElementsyiId("check2").checked = false;
}
else {
image.src = "foto.jpg";
}
}

fardao · #3 (**permalink**) 10/04/2013, 05:01

Muchas gracias ioniben

Aún añadiendo la id no consigo que funcione....

Saludos!

emprear · #4 (**permalink**) 10/04/2013, 07:43

Se puede, pero creo que lo está complicando, lo más lógico, si solo una opción es posible es que uses radios, y un radio adicional que represente la falta de opciones

Código HTML:

Ver original<!DOCTYPE html>
<html lang="es-ar">
<head>
<meta charset="utf-8" />
<title>Html5</title>
</head>
<body>
<form action="#" id="formulario">
opción A <input type="radio" value="A" name="opcion" /><br />
opción B <input type="radio" value="B" name="opcion" /><br />
opción C <input type="radio" value="C" name="opcion" /><br />
opción D <input type="radio" value="D" name="opcion" /><br />
ninguna <input type="radio" value="" name="opcion" checked/><br />
</form>
</body>
</html>

Saludos

ioniben · #5 (**permalink**) 10/04/2013, 08:18

Esto te deberia de funcionar:
<html>
<head>
<title>Test</title>

<script>
function check1(box) {
if (box.checked) {

document.getElementById("checkbox2").checked=false
}
}
function check2(box) {
if (box.checked) {
document.getElementById("checkbox1").checked=false
}
}

</script>
</head>

<body>

<form>

<input id="checkbox1" type="checkbox" onclick="check1(this)" />
<input id="checkbox2" type="checkbox" onclick="check2(this)" />
</form>
</body>
</html>

marcelocuiza_de · #6 (**permalink**) 10/04/2013, 10:31

a lo que te entiendo solo quieres tener una opcion activa de muchas, general mente los checkbox se usan para elegir mas de una opción..
te recomiendo usar radio buttons, asi podrias forzar que solo se tenga una opcion activada

Código HTML:

Ver original<form>
<input type="radio" name="opt" value="1">opcion uno<br>
<input type="radio" name="opt" value="2">opcion dos 
</form>

maycolalvarez · #7 (**permalink**) 10/04/2013, 12:26

concuerdo con @emprear, para tales casos un radio adicional para descarte, o un <select> con una opción en blanco, me parece que es complicarse la vida.

fardao · #8 (**permalink**) 11/04/2013, 03:26

Al final os he hecho caso y lo he cambiado a los radio buttons, todo funciona a la perfección!

Muchas gracias cracks!