Real value (R$) for Javascript number

Question

I made a script to turn a field that receives real value (with . and ,) to number, the problem is that it doesn’t work very well. Put this value in the field R $ 123.456.789.123,11 and see the answer, I wanted to receive this number: 123456789123.11 but ta returning this 123456.789.123.11

<script>
function campo6_10Up() {
    var campo1 = $('#campo1').val();
    // transforma para numero
    campo1 = formataNumero(campo1);
    console.log(campo1);    
}
function formataNumero(n) {
    n = n.replace('R$ ', '');
    if (n === "") {
        n = 0;
    } else {
        n = n.replace(".", "");
        n = n.replace(",", ".");
    }
    return n;
}
</script>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<input type="text" class="site_form" id="campo1" onkeyup="campo6_10Up()">

Where I went wrong?

Answer 1

Change n = n.replace(".",""); for n = n.split('.').join("");

function campo6_10Up() {
	var campo1 = $('#campo1').val();
	// transforma para numero
	campo1 = formataNumero(campo1);
	console.log(campo1);
}
function formataNumero(n) {
	n = n.replace('R$ ','');
	if(n === ""){
		n =  0;
	}else{
        n = n.split('.').join("");
	n = n.replace(",",".");
	}
	return n;
}

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<input type="text" class="site_form" id="campo1" onkeyup="campo6_10Up()">

Answer 2

I advise you to use the method toLocaleString(), where it returns a string with a language-sensitive representation of this number.

In basic use without specifying a location, the method will return a string formatted with the default location and options.

var numero = 3500;
console.log(numero.toLocaleString()); // Mostra "3,500" se a localização for U.S. English

This example shows some variations of localized number formats. In order to obtain the format of the language used in the user interface of your application, be sure to specify the language (and possibly some languages) using the argument locales:

var numero = 123456.789;

// O alemão usa vírgula como separador de decimal e ponto para milhares
console.log(numero.toLocaleString('de-DE'));
// → 123.456,789

// O árabe usa dígitos Árabes Orientais em muitos países que falam árabe
console.log(numero.toLocaleString('ar-EG'));
// → ١٢٣٤٥٦٫٧٨٩

// A Índia usa separadores de milhares/cem mil/dez milhões
console.log(numero.toLocaleString('en-IN'));
// → 1,23,456.789

// A chave de extensão nu requer um sistema de numeração, ex. decimal chinês
console.log(numero.toLocaleString('zh-Hans-CN-u-nu-hanidec'));
// → 一二三,四五六.七八九

// Quando informada uma língua sem suporte, como balinês,
// inclua uma língua reseva, neste caso indonésio
console.log(numero.toLocaleString(['ban', 'id']));
// → 123.456,789

The results obtained by toLocaleString can be customized using argument options:

var numero = 123456.789;

// informando um formato de moeda
console.log(numero.toLocaleString('de-DE', { style: 'currency', currency: 'EUR' }));
// → 123.456,79 €

// o yen japonês não tem uma unidade menor
console.log(numero.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }))
// → ￥123,457

// limitando a três dígitos significativos
console.log(numero.toLocaleString('en-IN', { maximumSignificantDigits: 3 }));
// → 1,23,000

Answer 3

With replace using regex you eliminate anything other than a number and a comma, and replace the comma by a dot:

-> n = R$ 123.456.789.123,11
-> n.replace(/[^\d,]/g, '')
-> 123456789123,11
-> n.replace(",", ".")
-> 123456789123.11

Testing:

function campo6_10Up() {
    var campo1 = $('#campo1').val();
    // transforma para numero
    campo1 = formataNumero(campo1);
    console.log(campo1);    
}
function formataNumero(n) {
    return n.replace(/[^\d,]/g, '').replace(",", ".");
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="site_form" id="campo1" onkeyup="campo6_10Up()">