2

Como eu faço para formatar o resultado de uma soma com virgula e ponto.

O Resultado:

80.50 *  52 = 4189.00

Como pretendo:

80.50 *  52 = 4,189.00

Meu JS

function calcular() {
 var valores1 = document.getElementsByClassName('txt1');
 var valores2 = document.getElementsByClassName('txt2');
 var resultados = document.getElementsByClassName('result');

 for (let i = 0; i < valores1.length; ++i) {
     let num1 = parseFloat(valores1[i].value);
     let num2 = parseFloat(valores2[i].value);
     resultados[i].value = (num1 * num2).toFixed(2);
 }
}
8

4 Respostas 4

3

Uma simples expressão regular resolve o seu problema:

var numero = "4189.00";
numero = numero.replace(/(\d{1,3}|\G\d{3})(?=(?:\d{3})+(?!\d))/g, "$1,");

Resultado: "4,189.00"

Essa expressão regular funciona para qualquer tamanho de número, com ou sem casas decimais (mas apenas até 3 casas após o ponto).

2
  • 1
    Olha, +1, mas "simples" e "expressão regular" na mesma frase é brincadeira. Commented 26/07/2017 às 18:42
  • Verdade, haha! É que eu já sou acostumado com expressões regulares. Commented 26/07/2017 às 18:43
1
resultados[i].value = (((num1 * num2).toFixed(2)).replace(/\B(?=(\d{3})+(?!\d))/g, ","));

Exemplo:

function calcular(){
    var valores1 = document.getElementsByClassName('txt1');
    var valores2 = document.getElementsByClassName('txt2');
    var resultados = document.getElementsByClassName('result');

    for (let i = 0; i < valores1.length; ++i){
        let num1 = parseFloat(valores1[i].value);
        let num2 = parseFloat(valores2[i].value);
        //resultados[i].value = (num1 * num2).toFixed(2);
        
       resultados[i].value = (((num1 * num2).toFixed(2)).replace(/\B(?=(\d{3})+(?!\d))/g, ","));
    }
}
<input class="txt1" value="80.50" name="opcao1" id="opcao1" type="text">
<input class="txt2" value="52" name="opcao2" id="opcao2" type="text">
<input class="result" value="" name="opcao3" id="opcao3" type="text" onclick="calcular()" placeholder="Clique aqui para calcular">

A idéia é combinar recursivamente - com a flag g (global) - fazendo um Lookahead positivo (?=(\d{3})+(?!\d)) - uma sequencia de 3 dígitos (\d{3}) desde que não haja nenhum digito à direita (?!\d) desta sequencia - e que não seja inicio ou fim da cadeia \B

Lookahead é uma forma de casar strings que tenham ou não um determinado final. É utilizado (?=...) para o positivo, ou seja, que terminem com, e (?!...) para o negativo, ou seja, que não termina com.

Um exemplo simples, seria a busca de Rafael seguido por Ferreira. Se existisse Rafael ou Rafael Outracoisa, ele não casaria. /Rafael(?= Ferreira)/

Ao contrário, neste exemplo, somente casaria o Rafael ou o Rafael Outracoisa, porém não casaria o Rafael Ferreira: /Rafael(?! Ferreira)

0
1

Eu uso o plugin maskMoney

Depois basta você personalizar seu campo com jQuery.

 $(document).ready(function () {
      $("#valor").maskMoney({ thousands: '', decimal: ',', allowZero: true });
  });

HTML

<div class="form-group" id="div_valor">
                        <div class="input-group">
                            <div class="input-group-addon">
                                @Html.LabelFor(model => model.valor, new { @class = "control-label col-md-2" })
                            </div>
                            @Html.TextBoxFor(model => model.valor, new { @class = "form-control" })
                        </div>
                    </div>
1

Existe um método chamado toLocaleString(). Este método retorna uma seqüência de caracteres com uma representação sensível ao idioma desse número.

Segundo a documentação a saída default do método é padrão americano

var number = 3500;
console.log(number.toLocaleString()) //3,500

O estranho é que ao testar não é isso que acontece, aplicando o padrão // 3.500. Há o padrão alemão que formata valores monetários conforme o Brasil. Para isto acrescente o parâmetro de-DE ao método

var number = 123456.789;
console.log(number.toLocaleString('de-DE', { maximumFractionDigits: 2 }))
//123.456,79
0

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .