Ir para conteúdo

POWERED BY:

Arquivado

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

marcelo2605

Somar campos com jquery

Recommended Posts

Criei esse script para somar dois campos:

 

var soma = Number($('#selecionar').val()) + Number($('.campo1').val())			
$('.campo2').val(soma);		

 

Mas o #selecionar é um input select e quando alterno para outro valor, a soma não é alterada.

Compartilhar este post


Link para o post
Compartilhar em outros sites

não é alterada por que não tem evento que faz a alteração. No teu caso, tu precisaria pensar em dois eventos distintos:

 

- Change para o select

- Blur ou Keypress para o campo input

 

Assim só quando atualizar a página será possivel perceber alguma coisa diferente. Posta o JS inteiro e o HTML da parte da soma, pra gente poder te ajudar.

 

Mateus

Compartilhar este post


Link para o post
Compartilhar em outros sites

Esse script atualiza o valor do campo 2 quando o select é alterado:

 

$("select").change(function () {
         var str = "";
         $("select option:selected").each(function () {
               str += $(this).val() + " ";
             });
		  var soma = Number(str) + Number($('.campo1').val())
         $(".campo2").val(soma);
       })
       .change();

 

Mas como faço para que o valor do campo 2 seja atualizado quando o campo1 for alterado?

 

Mateus, não posso usar blur porque a ação acontece depois que o mouse sai do campo input. Quero que a soma ocorra depois de digitar o novo valor.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tenta esse código para realizar as somas

 

$('#campo2').blur(function(){
var valor = parseInt($(this).val());
var valorSelect = parseInt($('#selecionar').val());
var soma = valor+valorSelect;
$('#total').val(soma);
});
$('#selecionar').change(function(){
var valor2 = parseInt($(this).val());
var valorSelect2 = parseInt($('#campo2').val());
var soma2 = valor2+valorSelect2;
$('#total').val(soma2);
});

 

Usando esse html abaixo

 

<input type="text" name="campo2" value="" id="campo2"/>
<select name="selecionar" id="selecionar">
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<input type="text" name="Total" value="" id="total" />

Compartilhar este post


Link para o post
Compartilhar em outros sites

Mateus, ajudou bastante.

 

Só troquei parseInt por Number para ele reconhecer as casas decimais.

 

De qualquer maneira o usuário precisa clicar em outro lugar da página para fazer a soma.

 

Obrigado!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu geralmente uso parseFloat ou parseInt pois é mais rápido do que transformar em Number. Aquele input total tu pode transformar para outro campo, tipo, uma parte da DOM, bastando trocar o $('#total').val(soma2) por $('#total').html(soma2);

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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