<div id="container">
  <div class="jumbotron" id="group">
    <form class="form-inline">
      <div class="form-group">
        <label for="groupNumber">Group:</label>
        <input type="text" class="groupNumber" />
      </div>
      <div class="form-group inputTop">
       <label for="quantity">Quantity:</label>
       <input type="text" class="quantity" />
      </div>
     <div class="form-group inputTop">
       <label for="systemPrice">System Price:</label>
       <input type="text" class="systemPrice" />
     </div>
     <div class="form-group">
        <label for="groupTotal">Group Total:</label>
       <input type="text" class="groupTotal" />
     </div>
   </form>

   <div class="row specs" id="pasted" contenteditable="true"></div>

   </div>
 </div>

$(document).ready(function() {
  $('.inputTop input').keyup(multInputs);

  function multInputs() {
    $('.inputTop').each(function() {
        var $quantity = $('.quantity', this).val();
        var $systemPrice = $('.systemPrice', this).val();
        var $groupTotal = ($quantity * 1) * ($systemPrice * 1)
    $('.groupTotal', this).text($groupTotal);
    });
   }
});

JS Fiddle: https://jsfiddle.net/waynebunch/jh6uhL1p/5/

He estado mirando esto por un tiempo y no veo nada malo. Básicamente, estoy tratando de usar JQuery para multiplicar var $quantity por var $systemPrice y mostrar el resultado en var $groupTotal. Habrá múltiples "grupos" de estos. ¿Alguien puede decirme qué estoy haciendo mal aquí o si estoy lejos? ¡Gracias!

0
Wayne Bunch 13 may. 2016 a las 19:45

4 respuestas

La mejor respuesta

Reemplazar:

$('.groupTotal', this).text($groupTotal);

Con:

$('.groupTotal', this).val($groupTotal);
0
SimianAngel 13 may. 2016 a las 16:52

Además de lo que han dicho los demás (usando val en lugar de text), también está llamando al método each en el selector incorrecto.

Los elementos con la clase quantity y systemprice son no elementos secundarios de los elementos con la clase inputtop. En cambio, use

$(".form-inline").each( ... );
0
Pandaqi 13 may. 2016 a las 17:02

Debe ser

$('.groupTotal', this).val($groupTotal);

Dado que .groupTotal es un input.

0
alepeino 13 may. 2016 a las 16:52

Deberías probar esta función:

 function multInputs() {

$('.group').each(function() {
  var $quantity = $('.quantity', this).val();
  var $systemPrice = $('.systemPrice', this).val();
  var $groupTotal = (parseInt($quantity) * 1) * (parseInt($systemPrice) * 1)

  if(isNaN($groupTotal))
    $('.groupTotal', this).val('');
  else
    $('.groupTotal', this).val($groupTotal);  
});

Espero que obtengas el resultado que deseas

0
Tony 13 may. 2016 a las 17:01