Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Sphinter

Marcar somente 2 CheckBox?

Por , em Javascript

Recommended Posts

Sphinter    0

Sphinter
Postado

Boa Tarde, não entendo muito de javascript.

Porém preciso de uma ajuda, tenha uma seção em um painel de administração onde o cliente poderá selecionar apenas 2 produtos para entrar em destaque, para ficar mais facil a navegação e o entedimento do cliente quero permitir que ele marque apenas 2 checkbox, ao marcar duas as outras trancam e ao desmarcar uma elas liberam...

 

Se alguem souber como posso fazer isso, ou tiver algum site que me de essa referencia eu agrdeço muito

Att,

Daniel

Compartilhar este post

Link para o post
Compartilhar em outros sites

andreia_sp    1

andreia_sp
Postado

Montei um exemplo rapido, entao se alguem tiver um melhor ae...

 

<script language="javascript">
total = 0;
function Conta(objeto)
{	
if (objeto.checked)
	total++
else
	total--


if (total >2)	
{
	objeto.checked = false;
	total--
}
}
</script>


<form name="frm">
<input type="checkbox" name="chk1" onclick="Conta(this)">
<input type="checkbox" name="chk2" onclick="Conta(this)">
<input type="checkbox" name="chk3" onclick="Conta(this)">
<input type="checkbox" name="chk4" onclick="Conta(this)">
</form>

Compartilhar este post

Link para o post
Compartilhar em outros sites

klaygomes    0

klaygomes
Postado

Montei um exemplo rapido, entao se alguem tiver um melhor ae...

Legal o seu código, só evite declarar variáveis globais, além de elas serem mais lentas, podem dá dor de cabeça depois.

 

Vou postar um exemplo, da forma como Sphinter solicitou:

 

 

(...)quero permitir que ele marque apenas 2 checkbox, ao marcar duas as outras trancam e ao desmarcar uma elas liberam...(...)

[url="http-~~-//december.com/html/4/element/html.html"]<html>[/url]
[url="http-~~-//december.com/html/4/element/head.html"]<head>[/url]
[url="http-~~-//december.com/html/4/element/title.html"]<title>[/url]Marque no Máximo 2</title>
</head>

[url="http-~~-//december.com/html/4/element/body.html"]<body>[/url]
[url="http-~~-//december.com/html/4/element/script.html"]<script[/url] type="text/javascript">       
window.onload = function()
{
        var b = document.getElementsByName('chk');    
        for(var x = 0; x < b.length;x++)
        {
                b[x].onclick= function()
                {
                var count = 0;
                        for(var y = 0; y < b.length;y++)
                                if( b[y].checked)
                                        count++;//
                                if(count > 1)//Verifico se pelo menos dois itens foram marcados
                                {
                                        for(var y = 0; y < b.length;y++)
                                        {
                                                if(!b[y].checked)
                                                        b[y].disabled = true;
                                        }
                                }
                                else
                                {
                                        for(var y = 0; y < b.length;y++)
                                                b[y].disabled = false;
                                }
                }
        }
}
</script>
[url="http-~~-//december.com/html/4/element/form.html"]<form[/url] name="form3" id="form3">
   [url="http-~~-//december.com/html/4/element/input.html"]<input[/url] type="checkbox" name="chk" value="valor1"> Item 1[url="http-~~-//december.com/html/4/element/br.html"]<BR>[/url]
        [url="http-~~-//december.com/html/4/element/input.html"]<input[/url] type="checkbox" name="chk" value="valor2"> Item 2[url="http-~~-//december.com/html/4/element/br.html"]<BR>[/url]
        [url="http-~~-//december.com/html/4/element/input.html"]<input[/url] type="checkbox" name="chk" value="valor3"> Item 3[url="http-~~-//december.com/html/4/element/br.html"]<BR>[/url]
        [url="http-~~-//december.com/html/4/element/input.html"]<input[/url] type="checkbox" name="chk" value="valor4"> Item 4[url="http-~~-//december.com/html/4/element/br.html"]<BR>[/url]
        [url="http-~~-//december.com/html/4/element/input.html"]<input[/url] type="checkbox" name="chk" value="valor5"> Item 5[url="http-~~-//december.com/html/4/element/br.html"]<BR>[/url]
        [url="http-~~-//december.com/html/4/element/input.html"]<input[/url] type="checkbox" name="chk" value="valor6"> Item 6
</form>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito