calculate input values with the same class

Asked

Viewed 817 times

1

I need to do a real-time calculation with Divs with the same class inserting the result into another.

The code I’m trying to develop is in the link below

var qtde_inputs = $('.quant').value;
var soma_inputs = 0;

$('.quant').each(function calcula(i,item){
  var valorItem = parseFloat($(item).val());

  if(!isNaN(valorItem))
    soma_inputs += parseFloat($(item).val());
    
  document.getElementById('seu_campo_destino_da_soma').value = (soma_inputs).toFixed(2);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input type="text" class="quant" value="10" onblur="calcula()">
  <input type="text" class="quant" value="10" onblur="calcula()">
  <input type="text" class="quant" value="40" onblur="calcula()">
  
  
  <input type="text" id="seu_campo_destino_da_soma">
<form>

javascript html

  • I guess? What kind of calculation?

  • I need to calculate these three inputs: <input type="text" class="Quant" value="10" onblur="calculates()"> <input type="text" class="Quant" value="10" onblur="calculates()"> <input type="text" class="Quant" value="40" onblur="calculates()"> Giving output on this <input type="text" id="seu_campo_destino_da_soma">

  • In case using JS to sum inputs with real-time Quant class giving the result in the total input, if it is necessary to create an i++ to generate a different Quant, but it is automated to search understand?

2 answers

1


Just put your calculation in a function and call this function every time one of your <input /> of class Quant is changed.

$('.quant').on("blur", Soma);

function Soma(){
  var soma = 0;
	$('.quant').each(function(){
    var valorItem = parseFloat($(this).val());

    if(!isNaN(valorItem))
      soma += parseFloat(valorItem);
  });
  
  $('#soma').val((soma).toFixed(2));
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form>
  <div>
    <input type="text" class="quant" value="0">
    +
  </div>
  <div>
    <input type="text" class="quant" value="0">
    +
  </div>
  <div>
    <input type="text" class="quant" value="0">
    +
  </div>
  <div>
    <input type="text" id="soma" value="0">
  </div>
<form>

  • I did not express myself very well, I would need to contact because each Quant would have a $i++, the script should be in something like this, but I could not make it work <script type='text/javascript'> $('#total'+index). on("Blur", Soma); Function Soma(){ var soma = 0; $('#total'+index). each(Function(){ var valueItem = parseFloat($(this).val()); if(!isNaN(valueItem)) sum += parseFloat(valueItem); }); $('#result'). val((sum).toFixed(2)); } </script>

  • This and the code that I am working on, I need to make the total that each product is calculated and all totals are summed in the final id https://anotepad.com/note/read/pw5nqb

  • Dude, my example adds up the 3 inputs and totals the last one, I don’t understand what you want to do, instead of showing the code says what you expect the code to do, example: "I have 3 fields and want the sum of them to be displayed in the last one"

  • I have a system that generates formulario for customers to fill right, and in case we generate the total of products and each contact generating a Total, say I inserted two products will be total and total1. So on, and I need to make all these totals add up and appear in Final id

  • Sorry, I have no way to help you, for me it is not yet clear what you want, it is difficult for outsiders to imagine your scenario if you are not specific and succinct

  • from what you said and from what @Caiqueromero answered, I believe just like him that your question already has solution, at least the logic you can have base and try to study and improve in order to adapt to your code, but what he did is great

  • If it’s great, I’m just picking it up to get it to interact with my code, would you be able to give me a contact to explain better and try to resovler? is a project for increase in a company which work

Show 2 more comments

-1

need to create a variable that receives values during the flow.

var val = document.getelementbyid('')

val = val + val

puts that in a while

and in the end drive the value.

Browser other questions tagged javascript html

You are not signed in. Login or sign up in order to post.