1

estoy intentado realizar una multiplicacion entre cantidad y precio, para sacar su total, sin embargo obtengo el siguiente error a la hora de hacerlo: TypeError: $(...).nextElementSibling is not a function, no se de que forma podria modificarlo de tal forma que sea aceptable, comparto mi codigo:

form

<form>
    <input type="text" id="quantity">
    <input type="text" id="price">
    <input type="text" class="result">
</form>

script

<script>
    $('#quantity, #price').keyup(function(){
        var cant = parseFloat(this.nextElementSibling('#quantity').val()) || 0;
        var price = parseFloat(this.nextElementSibling('#price').val()) || 0;
        var result = cant * price
        this.nextElementSibling('.result').val(result);
    })
</script>

1 respuesta 1

1

Podrías buscar los elementos usando $('selector') de jquery, así:

$('#quantity, #price').keyup(function() {
  var cant = parseFloat($('#quantity').val()) || 0;
  var price = parseFloat($('#price').val()) || 0;
  var result = cant * price
  $('.result').val(result);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input type="text" id="quantity"><br>
  <input type="text" id="price"><br>
  <input type="text" class="result">
</form>

nextElementSibling funcionaria si haces algo como document.getElementById("quantity").nextElementSibling pero te seleccionaría el hermano de quantity, que es price y no creo que sea muy práctico usarlo así, incluso, en el caso del código que pegué el hermano sería <br>.

Si quieres multiplicar ítems agregados dinamicamente, puedes usar clases en lugar de ids:

$('.multi').keyup(function() {

  var precio = [];
  var cantidad = [];

  $('.precio').each(function(i, obj) {
    precio.push(+obj.value);
  });

  $('.cantidad').each(function(i, obj) {
    cantidad.push(+obj.value);
  });

  var resultado = 0;

  precio.map((o, i) => {
    resultado += o * cantidad[i];
  });

  $("#result").val(resultado);

})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input type="text" class="multi precio"> precio<br>
  <input type="text" class="multi cantidad"> cantidad<br><br>
  <input type="text" class="multi precio"> precio<br>
  <input type="text" class="multi cantidad">cantidad<br><br>
  <input type="text" class="multi precio"> precio<br>
  <input type="text" class="multi cantidad">cantidad<br><br>
  <input type="text" class="multi precio"> precio<br>
  <input type="text" class="multi cantidad">cantidad<br><br><br>
  <input type="text" id="result">resultado
</form>

13
  • Gracias por contestar Emeeus! Fijate q inicialmente asi lo tenia, sucede que estoy replicando el formulario para cada item de compra, pero no estoy seguro como hacer para que de forma dinamica se le asigne un id a cada item, ya que al hacerlo de la forma en como me la sugieres, solo lo hace en un solo item, tienes alguna idea de como se podria asignar de forma automatica un id? o que cada calculo sea aplicable a cada item Commented el 16 ago. 2018 a las 17:39
  • Y de eso forma Emeeus, como podria identificar cual es precio y cual es cantidad, para realizar la multiplicacion? Commented el 16 ago. 2018 a las 18:09
  • Edite la pregunta agregando como podria, ser, pero no se si es correcto Emeeus? Commented el 16 ago. 2018 a las 18:17
  • 1
    @HectorHernandez me parece que necesitas esto jsfiddle.net/6oc1awyp
    – Emeeus
    Commented el 16 ago. 2018 a las 18:27
  • 1
    @HectorHernandez Aquí con subtotales jsfiddle.net/g3ujv45f si esto se vuelve mas complicado quizá te convine encararlo de otra manera, pero para empezar creo que está bien.
    – Emeeus
    Commented el 16 ago. 2018 a las 21:07

Tu Respuesta

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

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