Sum of numbers with javascript and php

Question

Sum of numbers with javascript and php

Navigation

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

0

Please, I need a little help, I am trying to add the values returned by a foreach ($ getDesEsp as $ itemListaDesEsp): but I always add the last value. in this case I have 4 records but I always add the last one. I'll leave my code please ... Excuse me but it's the first time commenting so I do not know how my code will look beforehand thanks to who can help me.

/ Here is what more of my code /

foreach ($obtenerDesEsp as $itemListaDesEsp):

       $precioCarro =  $itemListaDesEsp['costo_promedio_producto'];
       $stockCarro =  $itemListaDesEsp['exist_actual_producto'];
?> 


<script type="text/javascript">

function operacion() {caja = document.forms["sumar<?php echo $a++?>"].elements;                                                                              
var numero1 = Number(caja["cajas<?php echo $b++?>"].value);                                                                              
var numero2 = Number(caja["precios<?php echo $c++?>"].value);                                                                             
caja["totales<?php echo $d++?>"].value = ( numero1 - numero2 );                                                                              
console.log(caja["totales"]);
                                                                              }    
</script>                  


<form name="sumar<?php echo $e++?>">
<input type="text" name="caja" id="cajas<?php echo $f++?>" value="<?php  echo $stockCarro ?>" onchange="operacion()">
<input type="number" name="precios" id="precios<?php echo $g++?>" class="form-control" value="1" style="width:60px;" min="1" max="<?php echo $stockCarro?>" placeholder="Cantidad" onchange="operacion()">
<input type="text" name="totales" id="totales<?php echo $h++?>">
</form>
<?php  
endforeach;

javascript php

asked by Jhon Di 27.09.2018 в 17:05

source

2 answers

0

I do not know if I understood you correctly. What I understand is that you need for each form to multiply the box with the price, and put the result into the total input. I hope I have it right.

PS: I've invented the html based on your code.

let forms = Array.from(document.querySelectorAll("#contenedor form"));

forms.map((f) =>{
  let caja = f.querySelector(".caja");
  let precio = f.querySelector(".precio");
  let total = f.querySelector(".total");
  caja.addEventListener("input", ()=>{CalculaTotal(caja,precio,total) })
  precio.addEventListener("input", ()=>{CalculaTotal(caja,precio,total)})

})


function CalculaTotal(caja,precio,total){total.value = parseFloat(caja.value) * parseFloat(precio.value)}

<div id="contenedor">
<form name="sumar1" id="sumar1">
<input type="text" name="caja" class="caja" value="15" />
<input type="number" name="precios" class="precio" class="form-control" value="1" min="1" max="15" placeholder="Cantidad">
<input type="text" name="totales" class="total">
</form>
<form name="sumar1" id="sumar1">
<input type="text" name="caja" class="caja" value="40" />
<input type="number" name="precios" class="precio" class="form-control" value="1" min="1" max="40"><!--cantidad-->
<input type="text" name="totales" class="total">
</form>
<form name="sumar1" id="sumar1">
<input type="text" name="caja" class="caja" value="20" />
<input type="number" name="precios" class="precio" class="form-control" value="1" min="1" max="20">
<input type="text" name="totales" class="total">
</form>
<form name="sumar1" id="sumar1">
<input type="text" name="caja" class="caja" value="10" />
<input type="number" name="precios" class="precio" class="form-control" value="1" min="1" max="10">
<input type="text" name="totales" class="total">
</form>
</div>

UPDATE:

this time using the value of the 'name' 'attribute

let forms = Array.from(document.querySelectorAll("#contenedor form"));

forms.map((f) =>{
  let caja = f.querySelector("[name='caja']");
  let precio = f.querySelector("[name='precios']");
  let total = f.querySelector("[name='totales']");
  caja.addEventListener("input", ()=>{CalculaTotal(caja,precio,total) })
  precio.addEventListener("input", ()=>{CalculaTotal(caja,precio,total)})

})


function CalculaTotal(caja,precio,total){total.value = parseFloat(caja.value) * parseFloat(precio.value)}

<div id="contenedor">
<form name="sumar1" id="sumar1">
<input type="text" name="caja" class="caja" value="15" />
<input type="number" name="precios" class="precio" class="form-control" value="1" min="1" max="15" placeholder="Cantidad">
<input type="text" name="totales" class="total">
</form>
<form name="sumar1" id="sumar1">
<input type="text" name="caja" class="caja" value="40" />
<input type="number" name="precios" class="precio" class="form-control" value="1" min="1" max="40"><!--cantidad-->
<input type="text" name="totales" class="total">
</form>
<form name="sumar1" id="sumar1">
<input type="text" name="caja" class="caja" value="20" />
<input type="number" name="precios" class="precio" class="form-control" value="1" min="1" max="20">
<input type="text" name="totales" class="total">
</form>
<form name="sumar1" id="sumar1">
<input type="text" name="caja" class="caja" value="10" />
<input type="number" name="precios" class="precio" class="form-control" value="1" min="1" max="10">
<input type="text" name="totales" class="total">
</form>
</div>

I hope this works for you

answered by 27.09.2018 в 17:37

doubt about this code Can not be implicitly converted from double to int. There is already an explicit conversion

score 1 · Accepted Answer

Your problem is given because you create the function of javascript operation () within your cycle foreach therefore they will be created n times that same function so when you call only will execute the last, because they are overwritten. What you must do is remove it from the cycle and better assemble the logic of your code.

Here I leave the modified code:

<script type="text/javascript">

    function operacion(field) {
        //Obtengo el formulario
        var form = field.parentNode; 
        //Obtengo el valor del campo 1
        var numero1 = form.caja.value; 
        //Obtengo el valor del campo 2          
        var numero2 = form.precios.value;
        //Hago el calculo y se lo asigno al campo de texto correspondiente          
        form.totales.value = ( numero1 - numero2 );                                                                              
        console.log(form.totales.value);
    }    
</script>  

<?php
foreach ($obtenerDesEsp as $itemListaDesEsp):
   $precioCarro =  $itemListaDesEsp['costo_promedio_producto'];
   $stockCarro =  $itemListaDesEsp['exist_actual_producto'];
?> 

<form>
<input type="text" name="caja" value="<?php  echo $stockCarro ?>" onchange="operacion(this)" />
<input type="number" name="precios" class="form-control" value="1" style="width:60px;" min="1" max="<?php echo $stockCarro?>" placeholder="Cantidad" onchange="operacion(this)" />
<input type="text" name="totales" />
</form>
<?php  
endforeach;

Try and tell me if it worked for you.