De esta forma genero un listado dinamicamente, cada registro contiene un input text con la clase cantidad
.
$('.listado_facturas > tr').remove();
var listado_facturas = $('.listado_facturas');
$.each(response.data, function (index, value) {
$('<tr/>')
.append($('<td style="font-size: 11px;"/>').addClass('label-cell nuevo-td').text(value.TipoDocumento))
.append($('<td style="font-size: 11px;"/>').addClass('label-cell nuevo-td').text(value.NumeroDocumento))
.append('<div class="numero_documento" style="display:none">' + value.NumeroDocumento + '</div>')
.append('<div class="saldo_documento" style="display:none">' + value.Saldo + '</div>')
.append('<div class="oriplus_documento" style="display:none">' + value.Oriplus + '</div>')
.append($('<td style="font-size: 11px;"/>').addClass('label-cell nuevo-td').text(moneda(value.Saldo)))
.append($('<td style=" padding-right: 10px; border-right-width: 10px; padding-left: 10px;"/>').addClass('label-cell classCantidad derecha')
.append('<input type="text" style="width: 100%; font-size: 12px;" step="0.01" name="cantidad" class="cantidad" attr-num-doc="' + value.NumeroDocumento + '" min="1" pattern="^[0-9]+" placeholder="Monto">'))
.appendTo(listado_facturas);
});
Visualmente es de esta forma:
Al ingresar la informacion en el input text cantidad
, ejecuto la siguiente funcion.
$('.listado_facturas').on('change', '.cantidad', function(e){
let factura = $(this).closest('tr');
let cantidad_ingresada = factura.find('.cantidad').val().replace(/[^0-9\.]+/g,"");
let numero_documento = factura.find('.numero_documento').text();
let oriplus_documento = factura.find('.oriplus_documento').text();
let saldo_documento = factura.find('.saldo_documento').text();
console.log("Ingresando cantidad");
console.log(cantidad_ingresada);
console.log(saldo_documento);
if (cantidad_ingresada > saldo_documento){
myApp.alert("El monto ingresado es mayor que el saldo del documento");
}
else{
factura_seleccionada.NumeroDocumento = numero_documento
factura_seleccionada.Monto = cantidad_ingresada
factura_seleccionada.Oriplus = oriplus_documento
console.log(factura_seleccionada);
}
});
Entonces debo realizar una validacion que solo permita escribir en 1 input text, puede ser cualquier input text de la lista pero si el usuario ya ingreso 1 ya no puede ingresar en otros input text, hasta que borre el anterior podra ingresar informacion en otro.
De antemano muchas gracias.