0

Buen día,

Actualmente estoy teniendo este problema y no se como solucionarlo, lo que deseo es que por cada ciclo del while sume los 3 números y me de un sub total y al finalizar todas las repeticiones del while sume los subtotales y me arroje en valor total, todo esto en tiempo real, adjunto el código que tengo y agradezco su ayuda.

 <body>
<div  ng-app="">
        <?php 
                $i = 1;
              while ($i <= 3) {         
          ?>  
                <div>
                    <p>Numero 1 : <input type="number" ng-model="n1_<?=$i?>"></p>
                    <p>Numero 2 : <input type="number" ng-model="n2_<?=$i?>"></p>
                    <p>Numero 3 : <input type="number" ng-model="n3_<?=$i?>"></p>
                    <p>Sub total: <input type="number" value="{{n1_<?=$i?>+n2_<?=$i?>+n3_<?=$i?>}}" class="itemTotalNeto"></p>
                </div>
            <?php 
            $i= $i + 1;
                  } 
          ?>
        <p>TOTAL GENERAL = <input type="number" id="totalGeneral"></p>
</div> 
</body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<script>
items = document.getElementsByClassName("itemTotalNeto")
for (var i = 0; i < items.length; i++) {
 items[i].addEventListener('change', function() {
  n = document.getElementById("totalGeneral");
  n.value = parseInt("0"+n.value) + parseInt("0"+this.value) - parseInt("0"+this.defaultValue);
 this.defaultValue = this.value;
 });
};
</script>
4
  • El valor asignado a los subtotales se aplica solo cuando carga la página y, en caso de cambiar por medio de una función, sin que el usuario teclee el nuevo valor, no se va a disparar el evento change.
    – Triby
    el 16 ene. 2021 a las 0:16
  • Triby y como puedo hacer para ejecutar la función sin que el usuario teclee el numero? el 16 ene. 2021 a las 3:58
  • Necesitas intervención del usuario, ya sea cuando se modifican los otros campos o con algún clic
    – Triby
    el 16 ene. 2021 a las 4:05
  • Como podría colocar un botón llamado calcular total y que me arroje el resultado? el 16 ene. 2021 a las 4:07

1 respuesta 1

0

Ya pude resolverlo, dejo el código por si alguien se topa con el mismo problema

<body>
<form action="" method="post">
<div  ng-app="">
        <?php 
                $i = 1;
              while ($row = mysqli_fetch_array($legalizaciones)) {
                        
          ?>  
                <div><?=$row['numero_recibo']?>
                    <p>Numero 1 : <input type="number" ng-model="n1_<?=$i?>"></p>
                    <p>Numero 2 : <input type="number" ng-model="n2_<?=$i?>"></p>
                    <p>Numero 3 : <input type="number" ng-model="n3_<?=$i?>"></p>
                    <p>Resultado : <input type="number" value="{{n1_<?=$i?>+n2_<?=$i?>+n3_<?=$i?>}}" class="monto" onkeyup="sumar();" readonly></p>
                </div>
                <br>
                <br>
            <?php 
            $i= $i + 1;
                  } 
          ?>
                <br/ >
                <span>TOTAL </span>
                <input type="number" id="total" value="0" readonly/>
</div>
</form> 
</body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
var f = function sumar()
{
  const $total = document.getElementById('total');
  let subtotal = 0;
  [ ...document.getElementsByClassName( "monto" ) ].forEach( function ( element ) {
    if(element.value !== '') {
      subtotal += parseFloat(element.value);
    }
  });
  $total.value = subtotal;
}; 
    window.setInterval(f, 100); 
    f(); 
</script>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.