0

Estoy desarrollando una aplicación web para una agencia de viajes, en esta aplicación se registran las ventas, dichas ventas tienen servicios que varia el costo de cada uno dependiendo el cliente, proveedor y/o destino.
En la parte donde agrego dichas ventas tengo un formulario donde en varios tengo una función que captura el evento onKeyUp de ciertos input y hace el calculo de el iva, ish, precio final, markup total de la venta, etc.
Hasta aquí todo bien, mi problema es que quiero agregar otro formulario para poder editar esa venta y quiero utilizar esa misma función para no escribir otra función especificamente para editar la venta.

¿Como puedo diferenciar los inputs que tienen el mismo nombre o clase pero que son de diferentes formularios?

1 respuesta 1

1

Tienes diferentes formas de hacerlo.

Una sencilla es buscar entre los padres del control que ha generado el evento el form al que pertenece. Una vez localizado el form puedes encontrar el resto de controles que quieres utilizar dentro de los hijos de éste.

Aquí tienes un ejemplo con dos formularios iguales con campos para precio, cantidad y total. El evento keyup de los campos precio y cantidad lanzan una función que calcula automáticamente el total utilizando los campos del formulario en el que se está editando el valor:

$(function(){
  function calcularprecio(){
    var $form = $(this).parents('form');
    var $precio = $form.find('.precio');
    var $cantidad = $form.find('.cantidad');
    var precio = parseFloat($precio.val());
    var cantidad = parseFloat($cantidad.val());
    if (!isNaN(precio) && !isNaN(cantidad)){
      $form.find('.total').val(precio * cantidad);
    }
  }
  
  $('.precio,.cantidad').keyup(calcularprecio);
});
form{
  padding: 20px;
}
div{
  display: block;
  padding: 10px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<div>Precio <input type="number" class="precio"></div>
<div>Cantidad <input type="number" class="cantidad"></div>
<div>Total <input type="number" class="total"></div>
</form>
<form>
<div>Precio <input type="number" class="precio"></div>
<div>Cantidad <input type="number" class="cantidad"></div>
<div>Total <input type="number" class="total"></div>
</form>

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.