[Resolvido] verificar quais checkboxes estão marcados e somar os

[rcdesign 1]

Tenho um formulário em html com 6 opções de checkbox, preciso verificar, antes do formulário ser enviado, quais estão marcados, soma-los e mostrar o resultado ao usuário... sendo que o primeiro checkbox deverá ser obrigatório.

 

seria apresentado ao usuário mais ou menos isso aqui (todos estarão checados por padrão):

Opção1: <input name="opcao1" id="opcao1" type="checkbox" value="1200" checked />

Opção2: <input name="opcao2" id="opcao2" type="checkbox" value="480" checked />

Opção3: <input name="opcao3" id="opcao3" type="checkbox" value="50" checked />

Opção4: <input name="opcao4" id="opcao4" type="checkbox" value="60" checked />

Opção5: <input name="opcao5" id="opcao5" type="checkbox" value="60" checked />

Opção6: <input name="opcao6" id="opcao6" type="checkbox" value="100" checked />

 

eu achei este script aqui que faz a soma de todos os campos,independente dele estar ou não marcado:

window.onload = function() {
document.getElementById("calcular").onclick = function() {
var val1 = document.getElementById("opcao1").value;
var val2 = document.getElementById("opcao2").value;
var val3 = document.getElementById("opcao3").value;
var val4 = document.getElementById("opcao4").value;
var val5 = document.getElementById("opcao5").value;
var val5 = document.getElementById("opcao5").value;
var val6 = document.getElementById("opcao6").value;
alert(eval(val1) + eval(val2) + eval(val3) + eval(val4) + eval(val5) + eval(val6));
        }
    }

alguém pode me ajudar? não faço idéia do que/como fazer..

[rcdesign 1]

ATUALIZANDO

 

achei um outro código mas que não está funcionando corretamente... este faz a soma em real-time, mas está calculando errado..

além de não pegar o valor correto em alguns checkboxes ao desmarcar uma das seleções ele soma novamente.. talvez precise de alguns ajustes e eu não sei o que fazer.. alguém??

 

total = 0; //toal é zero no começo
function Somar(){
var form = document.forms[0]; //pega o primeiro form q aparecer
        for (var i=0;i < form.elements.length;i++) //checa o numero de elementos no form
        {
                if(form.elements[i].type == "checkbox") //procura somente pelos 'checkbox'
                {
                        checa = form.elements[i].getAttribute("name"); //pega o atributo ID de cada checkbox
                        if(checa == "check[]" && (form.elements[i].checked)){ //compara pra ver se está marcado
                                total = (parseInt(total) + parseInt(form.elements[i].value)); //transforma em Integer pra poder somar certo
                        }
                }
        }
        form.total_valor.value = total; //atualiza o campo

}

cada um de meus checkboxes está assim (com seus respectivos dados, é claro)

<input name="check[]" id="opcao1" type="checkbox" value="480" onclick="Somar();"/>

[rcdesign 1]

Código funcionando certinho... menos no IE..

 

 

<script type="application/javascript" language="javascript">

var total = 1500;

function soma(campo) {

if (campo.checked)

total += eval(campo.value);

else

total -= eval(campo.value);

document.inscricaoatsp.total.value = total;

}

</script>

 

e meus checkbox's estão assim:

 

<input name="hotel" id="hotel" type="checkbox" value="70" onclick="soma(this)" />

<input name="transporte" id="transporte" type="checkbox" value="30" onclick="soma(this)" />

<input name="alimentacao" id="alimentacao" type="checkbox" value="30" onclick="soma(this)" />

 

Alguém pode me dizer isso não funciona no Internet Explorer?

[Thiago Retondar 18]

function somar(){
    var inputs = document.getElementsByName("check[]");
    var soma = 0;
    for(var i = 0; i < inputs.length; i++){
        if(inputs[i].checked){
            soma += parseFloat(inputs[i]);
        }
    }
    document.getElementsByName("total_valor")[0].value = soma;
}

Acho que deve funcionar.

 

Chame a função apenas no botão para calcular.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[rcdesign 1]

Achei uma solução que funciona no IE (testado também no Firefox, Flock, Ópera e Chrome)

 

JavaScript

<script language="JavaScript">
/* A PARTE EM JAVASCRIPT NÃO É NECESSÁRIO ALTERAR */
function checkChoice(whichbox) {
with (whichbox.form) {
if (whichbox.checked == false)
hiddentotal.value = eval(hiddentotal.value) - eval(whichbox.value);
else
hiddentotal.value = eval(hiddentotal.value) + eval(whichbox.value);
return(formatCurrency(hiddentotal.value));
}
}
function formatCurrency(num) {
num = num.toString().replace(/\$|\,/g,'');
if(isNaN(num)) num = "0";
cents = Math.floor((num*100+0.5)%100);
num = Math.floor((num*100+0.5)/100).toString();
if(cents < 10) cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
num = num.substring(0,num.length-(4*i+3))+','+num.substring(num.length-(4*i+3));
return ("R$" + num + "." + cents);
}
</script>

HTML

<input name="campo1" id="campo1" type="checkbox" value="1.500"  onClick="this.form.total.value=checkChoice(this);"/>
<input name="campo2" id="campo2" type="checkbox" value="1.000"  onClick="this.form.total.value=checkChoice(this);"/>

Total: <input type="text" name="total" value="" readonly>
       <input type="hidden" name="hiddentotal" value="0"> /*altere este valor se houver um valor inicial

[rcdesign 1]

só pra complementar...

 

na verdade, o script do post do dia 26 também funciona no IE se tirarmos a informação type="application/javascript"

 

e, consequentemente, o script que postei hoje deixa de funcionar no IE se incluirmos o type ...

 

não sei porque isso acontece...coisas do Internet Explorer...

[William Bruno 1501]

o type que eu conheço, é type="text/javascript"

[Thiago Retondar 18]

Para web, use sempre o que o Bruno mostrou...

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[rcdesign 1]

Lição aprendida!!

 

Obrigado Bruno, Obrigado Thiago..