Buenas, tengo un código el cual me esta dando un problema.
Mi código se compone de 3 cosas, una variable total, otra para dinero recibido y otra para mostrar cambio o pendiente de pagar (dependiendo el resultado que me de al verificar el total y el dinero recibido), por ejemplo si mi total es = 500, mi recibido = 400 my otra variable debe ser = Falta por pagar: 100.
Hasta ahora tengo un código funcionando pero el detalle es al mostrar esta ultima variable, me muestra el resultado correcto pero no logro hacer que muestre si es cambio o si es dinero pendiente de pagar, también el resultado que me da es un numero entero negativo, quisiera que si fuera cambio se mostrara sin lo negativo.
$(document).ready(function() {
var dolar = 17.50;
$('#Total').on('keyup', function() {
var valor = $(this).val();
if (valor == "") {
$('#TotalLbl').text("$00.00");
} else {
$('#TotalLbl').text("Total: $" + parseFloat(valor).toFixed(2));
}
});
$('.money').on('keyup', function() {
var dollar = $('#USD').val() * dolar;
var mx = $('#MXN').val();
valor = parseFloat(mx) + parseFloat(dollar);
if (valor == "") {
$('#Received').text("$00.00");
} else {
$('#Received').text("Received: $" + parseFloat(valor).toFixed(2));
var falta = ($('#Total').val() - valor);
var tot = $('#Total').val();
console.log(falta);
if (parseFloat(falta) < parseFloat(tot))
$('#INeedThisTo0').text("Cambio: $" + parseFloat(falta).toFixed(2));
else
$('#INeedThisTo0').text("Pendiente: $" + parseFloat(falta).toFixed(2));
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input placeholder="Total.." type="number" id="Total" />
<input placeholder="MXN.." type="number" class="money" id="MXN" />
<input placeholder="USD.." type="number" class="money" id="USD" />
<br>
<label id="TotalLbl"></label>
<label id="Received"></label>
<label id="INeedThisTo0"></label>
<label id="Change"></label>