Make me get the total of adding and subtracting several jquery inputs

Question

Make me get the total of adding and subtracting several jquery inputs

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

I have the following function that reads the subtotal and adds the inpuesto that is defined in a hidden input and gives me the total, all that works well but I want to add a discount and send it so that when I enter it in the corresponding input, it adds up, but it does not do anything, the function is this.

function sumar(){
subtotal = 0;
$("#tbventas tbody tr").each(function(){
    subtotal = subtotal + Number($(this).find("td:eq(5)").text());
});
$("input[name=subtotal]").val(subtotal.toFixed(2));
porcentaje = $("#impuesto").val();
impuesto = subtotal * (porcentaje/100);
$("input[name=impuesto]").val(impuesto.toFixed(2));
descuento = $("input[name=descuento]").val();
envio = $("input[name=envio]").val();
total = subtotal + impuesto - descuento + envio;
$("input[name=total]").val(total.toFixed(2));

}

and the inputs

 <input type="text" class="form-control" placeholder="0.00" name="subtotal" readonly="readonly">
 <input type="text" class="form-control" placeholder="0.00" name="impuesto" readonly="readonly">
 <input type="text" class="form-control" placeholder="0.00" name="descuento"  >
 <input type="text" class="form-control" placeholder="0.00" name="envio" value="0.00" readonly="readonly">
 <input type="text" class="form-control" placeholder="0.00" name="total" readonly="readonly">

the function gives me the value of the total and imposed subtotal, but does not do anything when I enter a value in discount or send. Greetings

jquery

asked by Francisco 14.02.2018 в 22:10

source

2 answers

0

If you want the values to be updated once you change the value of certain inputs, you must put a handler on the event onchange

Something like: <input type="text" class="form-control" placeholder="0.00" name="descuento" onchange="sumar()" >

answered by 14.02.2018 в 23:38

Insert a record in two related tables Empty list after having filled in javascript [duplicated]

score 1 · Accepted Answer

Check the example that I put you acontinuacion:

I explain: The detail in your calculations is:

You need to convert the string to float, for that parseFloat( $("input[name=subtotal]").val())

Validate that the result is not NaN = No to Numeric, so that your result is really a number. subtotal = isNaN(subtotal) ? 0 : subtotal;

After that you can already do the calculations well, because it was marking error the .toFixed because it can not be applied in NaN bone in values that are not NUMBERS.

$("#sumar").click(function(){
  sumar();
});

function sumar(){
  subtotal = parseFloat( $("input[name=subtotal]").val());//Para convertir el string a FLOAT
  subtotal = isNaN(subtotal) ? 0 : subtotal;  //Valido si quedo en isNaN si es asi lo inicializo en cero, si no tomo el valor ya convertido en float
  console.log('Subtotal: ' + subtotal);
  
  /*
  $("#tbventas tbody tr").each(function(){
      subtotal = subtotal + Number($(this).find("td:eq(5)").text());
  });*/
  
  $("input[name=subtotal]").val(subtotal.toFixed(2));
  porcentaje = parseFloat($("#impuesto").val()); 
  porcentaje = isNaN(porcentaje) ? 0 : porcentaje;//Esta validacion para poder hacer los calculos
  console.log('Porcentaje: ' + porcentaje);
  impuesto = subtotal * (porcentaje/100);
  impuesto = isNaN(impuesto) ? 0 : impuesto;  
  console.log('Impuesto: ' + impuesto);
  //Muestro el impuesto 
  $("input[name=impuesto]").val(impuesto.toFixed(2));
  
  descuento = parseFloat($("input[name=descuento]").val()); 
  descuento = isNaN(descuento) ? 0 : descuento;
  console.log('descuento: ' + descuento);
  
  envio = parseFloat($("input[name=envio]").val()); 
  envio = isNaN(envio) ? 0 : envio;
  console.log('Envio: ' + envio);
  
  total = subtotal + impuesto - descuento + envio;
  //console.log(subtotal + impuesto - descuento + envio);
  $("input[name=total]").val(total.toFixed(2));

}

Porcentaje
<input type="text" class="form-control" placeholder="0.00" value="25"  id="impuesto" >
<br/><br/><br/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Subtotal
<input type="text" class="form-control" placeholder="0.00" value="1000"  name="subtotal" >
<br/>
impuesto
 <input type="text" class="form-control" placeholder="0.00" name="impuesto" readonly="readonly">
<br/>
 descuento
 <input type="text" class="form-control" placeholder="0.00" value="10.00" name="descuento"  >
<br/>
 envio
 <input type="text" class="form-control" placeholder="0.00" value="100.00" name="envio" value="0.00" readonly="readonly">
<br/>
 total
 <input type="text" class="form-control" placeholder="0.00" name="total" readonly="readonly">
 
 
<br/>

<input type="button" value="sumar" id="sumar"/>