How to get rid of Nan when I erase the i8 field

Asked

Viewed 79 times

-3

I have a form with two fields i8 and i9 and a function calcular which places the results in a field result. When the field i8 is blank and function calcular() is called, appears written on it NaN. How do I fix it?

Here is my code:

<script>
String.prototype.formatMoney = function() {
    var v = this;

    if(v.indexOf('.') === -1) {
        v = v.replace(/([\d]+)/, "$1,00");
    }

    v = v.replace(/([\d]+)\.([\d]{1})$/, "$1,$20");
    v = v.replace(/([\d]+)\.([\d]{2})$/, "$1,$2");
    v = v.replace(/([\d]+)([\d]{3}),([\d]{2})$/, "$1.$2,$3");

    return v;
};
function id( el ){
    return document.getElementById( el );
}
function getMoney( el ){
//var money = id( el ).value ? id( el ).value.replace( ',', '.' ) : 0; valor sem o R$NaN
var money = id( el ).value.replace( ',', '.' );
return parseFloat( money )*1000;
}
function calcular()
{
    var total = getMoney('i9')-getMoney('i8');
    //id('result').value = 'R$'+ String(total/1000).formatMoney();
    id('result').value = String(total/1000).formatMoney();
}

</script>

<input id="result">
javascript nan

  • I added the description of your problem to your question. This is very important, as a lot of code without further explanation tends to confuse users and lead them to negatively question. On this site, it is important to always strive to write the question clearly and describe well the problem you are facing to avoid this kind of boring thing. Anyway, so that’s settled. Welcome to the site. :)

1 answer

2

The trick is to use the function isNaN.

In addition, in the function getMoney(el), you multiply by 1000 and then divide by 1000 in calcular(). It seems to me to be a totally unnecessary gambit, and so I took.

Here is your resulting code. To test, click on first blue button Execute downstairs:

function formatMoney(value) {
    var negativo = value < 0;
    var v = Math.floor(Math.abs(value) * 100);
    var r = String(v);
    var s = r.length;
    r = s === 1 ? "0,0" + r
            : s === 2 ? "0," + r
            : r.substring(0, s - 2) + "," + r.substring(s - 2, s);
    for (var i = s - 5; i > 0; i -= 3) {
        r = r.substring(0, i) + "." + r.substring(i, r.length);
    }
    return (negativo ? "-" : "") + r;
};

function id(el) {
    return document.getElementById(el);
}

function getMoney(el) {
    var money = parseFloat(id(el).value.replace(',', '.'));
    return isNaN(money) ? 0.0 : money;
}

function calcular() {
    var total = getMoney('i9') - getMoney('i8');
    id('result').value = formatMoney(total);
}
<p>i8: <input type="text" id="i8" /></p>
<p>i9: <input type="text" id="i9" /></p>
<p>Resultado: <input type="text" id="result" readonly /></p>
<input type="button" onclick="javascipt:calcular();" value="Calcular"/>

You may have noticed I’ve completely changed your function formatMoney. Which is no longer a method mix-in of String and became a normal function. The reason for this is that your method formatMoney did not work to properly format numbers greater than 1 million or with many decimal places.

Here’s a test of your method formatMoney original, note the output produced the problems (click the blue button Execute that is down below, the second of this answer):

String.prototype.formatMoney = function() {
    var v = this;

    if(v.indexOf('.') === -1) {
        v = v.replace(/([\d]+)/, "$1,00");
    }

    v = v.replace(/([\d]+)\.([\d]{1})$/, "$1,$20");
    v = v.replace(/([\d]+)\.([\d]{2})$/, "$1,$2");
    v = v.replace(/([\d]+)([\d]{3}),([\d]{2})$/, "$1.$2,$3");

    return v;
};

document.write("0".formatMoney() + "<br>");
document.write("5".formatMoney() + "<br>");
document.write("10".formatMoney() + "<br>");
document.write("987.65".formatMoney() + "<br>");
document.write("987.6543".formatMoney() + "<br>");
document.write("1000".formatMoney() + "<br>");
document.write("1000.23".formatMoney() + "<br>");
document.write("999999.99".formatMoney() + "<br>");
document.write("1999999.99".formatMoney() + "<br>");
document.write("999999999.99".formatMoney() + "<br>");
document.write("-999999999.99".formatMoney() + "<br>");
document.write("0.05".formatMoney() + "<br>");
document.write("-0.05".formatMoney() + "<br>");
document.write("0.005".formatMoney() + "<br>");

Here’s a test of the new version of formatMoney (click on the blue button Execute that is down there, the third and last):

function formatMoney(value) {
    var negativo = value < 0;
    var v = Math.floor(Math.abs(value) * 100);
    var r = String(v);
    var s = r.length;
    r = s === 1 ? "0,0" + r
            : s === 2 ? "0," + r
            : r.substring(0, s - 2) + "," + r.substring(s - 2, s);
    for (var i = s - 5; i > 0; i -= 3) {
        r = r.substring(0, i) + "." + r.substring(i, r.length);
    }
    return (negativo ? "-" : "") + r;
};

document.write(formatMoney(0) + "<br>");
document.write(formatMoney(5) + "<br>");
document.write(formatMoney(10) + "<br>");
document.write(formatMoney(987.65) + "<br>");
document.write(formatMoney(987.6543) + "<br>");
document.write(formatMoney(1000) + "<br>");
document.write(formatMoney(1000.23) + "<br>");
document.write(formatMoney(999999.99) + "<br>");
document.write(formatMoney(1999999.99) + "<br>");
document.write(formatMoney(999999999.99) + "<br>");
document.write(formatMoney(-999999999.99) + "<br>");
document.write(formatMoney(0.05) + "<br>");
document.write(formatMoney(-0.05) + "<br>");
document.write(formatMoney(0.005) + "<br>");

Browser other questions tagged javascript nan

You are not signed in. Login or sign up in order to post.