Jump to content
nmoa

[Resolvido] somar checkbox

Recommended Posts

nmoa

boas

estou com dificuldade obter um resultado no meu código

e a ideia é ter 3 chekcbox todas elas com um valo assocido, neste caso seria uma percentagem,

depois teria um campo onde colocaria o valor e por fim teria outro campo ou div onde iria o total.

a ideia seria ao carregar na checkbox 50% , fosse buscar o valor colocado no input valor e multiplicasse por 0,50 para se obter a comissao

podem ver a ideia aqui para ser mais facil

obrigado desde já pela atenção

https://jsfiddle.net/duitdesign/4v95am9o/2/

Share this post


Link to post
Share on other sites
HappyHippyHippo


<html>
 <head>
   <script>
     function calc() {
       var value = document.getElementById('valor');
       var check1 = document.getElementById('check1');
       var check2 = document.getElementById('check2');
       var check3 = document.getElementById('check3');
       var total = document.getElementById('total');

       var perc = 1;
       if (check1.checked) { perc = perc - parseFloat(check1.value); }
       if (check2.checked) { perc = perc - parseFloat(check2.value); }
       if (check3.checked) { perc = perc - parseFloat(check3.value); }

       total.innerHTML = parseFloat(value.value) * (1 - perc);
     }
   </script>
 </head>

 <body>
   <p>
     <input type="number" id="valor" value="0" onchange="calc();"/><br>
   </p>

   <p>
     <input type="checkbox" name="check1"  id="check1" value="0.50" onclick="calc();" />
     <label for="check1">Comissão 50%</label>
   </p>

   <p>
     <input type="checkbox" name="check2"  id="check2" value="0.25" onclick="calc();" />
     <label for="check2">Partilha 25%</label>
   </p>

   <p>
     <input type="checkbox" name="check3"  id="check3" value="0.10" onclick="calc();" />
     <label for="check3">Partilha loja 10%</label>
   </p>

   <p>
     <div id="total" style="border: 1px solid black; padding: 2px 5px;">0</div>
   </p>
 </body>
</html>


IRC : sim, é algo que ainda existe >> #p@p

Share this post


Link to post
Share on other sites
nmoa



<html>
 <head>
<script>
  function calc() {
	var value = document.getElementById('valor');
	var check1 = document.getElementById('check1');
	var check2 = document.getElementById('check2');
	var check3 = document.getElementById('check3');
	var total = document.getElementById('total');

	var perc = 1;
	if (check1.checked) { perc = perc - parseFloat(check1.value); }
	if (check2.checked) { perc = perc - parseFloat(check2.value); }
	if (check3.checked) { perc = perc - parseFloat(check3.value); }

	total.innerHTML = parseFloat(value.value) * (1 - perc);
  }
</script>
 </head>

 <body>
<p>
  <input type="number" id="valor" value="0" onchange="calc();"/><br>
</p>

<p>
  <input type="checkbox" name="check1"  id="check1" value="0.50" onclick="calc();" />
  <label for="check1">Comissão 50%</label>
</p>

<p>
  <input type="checkbox" name="check2"  id="check2" value="0.25" onclick="calc();" />
  <label for="check2">Partilha 25%</label>
</p>

<p>
  <input type="checkbox" name="check3"  id="check3" value="0.10" onclick="calc();" />
  <label for="check3">Partilha loja 10%</label>
</p>

<p>
  <div id="total" style="border: 1px solid black; padding: 2px 5px;">0</div>
</p>
 </body>
</html>

Boas

obrigado pela resposta , eu testei e não me faz nada

https://jsfiddle.net/upfyb55d/

o que está a faltar?

Share this post


Link to post
Share on other sites
HappyHippyHippo

o código apresentado foi testado e funciona correctamente, não me interessa o que tenhas no jsfiddle


IRC : sim, é algo que ainda existe >> #p@p

Share this post


Link to post
Share on other sites
nmoa

o código apresentado foi testado e funciona correctamente, não me interessa o que tenhas no jsfiddle

Edited by nmoa

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.