How to perform an operation of subtraction multiplication and sum automatically in html

Question

How to perform an operation of subtraction multiplication and sum automatically in html

Navigation

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

0

<tr>
<td>
    <label class="title">Chocolate: </label><br>
 <label><?php echo $ver[4];  ?></label>
</td> 

<td> 
    <input type="hidden" name="ChocolateIn" value="<?php echo $ver[4];  ?>">

    <input type="number" class="form-control form-control-lg" name="Chocolate" placeholder="Saldo" required >
</td>

    <input type="hidden" id="preciochocolate"  value="500"/>


<td>
    <input type="text" class="form-control form-control-sm"  id="RChocolate" name="RChocolate" value="0" readonly>

</td>

Lemonade:

    <label><?php echo $ver[5];  ?></label>
</td>

<td>  
    <input type="hidden" name="LimonadaIn" value="<?php echo $ver[5];  ?>">

    <input type="number" class="form-control form-control-lg" name="Limonada" placeholder="Saldo" required>
</td>

    <input type="hidden" id="preciolimonada" value="350"/>

<td>
    <input type="text" class="form-control form-control-sm" id="RLimonada" name="RLimonada" value="0" readonly >
</td>

** Nesesito that subtracts the value of the "ChocolateIn" input that results from a sql query. subtract it with the value of the "Chocolate" input that the user enters manually the result of that operation multiplies it with the value of the input "preciochocolate" the result of that is stored in the "RChocolate" input likewise with the other row of "Lemonade"

at the end show me the sum of the input "RChocolate and RLimonada" without using buttons thanks I'm new but I learn fast, use php html, how should I do these operations thanks **

html php

asked by Jesus Emanuel Becerra Santamar 22.09.2018 в 18:38

source

2 answers

1

ready I could make the sum of the dynamic inputs, look in forums of our platform and I found this code that worked for me, adding the classes. Many thanks to Sonia Toledo for all her support.

    <script >

  function suma() {
      var add = 0;
      $('.form-control-sm').each(function() {
          if (!isNaN($(this).val())) {
              add += Number($(this).val());
          }
      });
      $('#totalventa').val(add);
    
  };
</script>

answered by 23.09.2018 в 17:35

Why does not the return work for me? JAVA POO Use object class type from GUI,

score 1 · Accepted Answer

Put this javascript code after all your html:

<script>
 
 document.querySelector("input[name=Chocolate]").addEventListener("input", function(e){
    var chocoin= document.querySelector("input[name=ChocolateIn]").value;
 var chocolate= e.target.value;  
 var chocoprecio= document.getElementById("preciochocolate").value; 
 var rescho= ( parseInt(chocoin) - parseInt( chocolate)) * parseInt(  chocoprecio);

 document.querySelector("input[name=RChocolate]").value=    (  chocolate.length == 0 ||  rescho === NaN || rescho === undefined) ? 0 : rescho ;


});

   document.querySelector("input[name=Limonada]").addEventListener("input", function(e){
    var limoin= document.querySelector("input[name=LimonadaIn]").value;
 var limonada=  e.target.value; 
 var limoprecio= document.getElementById("preciolimonada").value;
 var reslim= ( parseInt(limoin) - parseInt( limonada)) * parseInt(  limoprecio);
 document.querySelector("input[name=RLimonada]").value=    (  limonada.length == 0 || reslim === NaN || reslim === undefined) ? 0 : reslim ;
/**************************/
//nueva linea a agregar
var totalf= rescho +reslim;
document.getElementById("result-final").value= totalf;
/**agrega un input a tu formulario

<input type="number" id="result-final" readonly/>
   }) ;

 

 </script>

Input-type events are useful for fields where you type values and want to capture their actual values when you write new digits. You also do not need buttons with this code