Formatting result for currency [duplicate]

Question

Formatting result for currency [duplicate]

Navigation

#1 by (4 votes)
#2 by (0 votes)

1

How do I format the value of two input in the currency format by rounding the values.

For example, if the commission is 1200 the input return ir and valor líquido give 18% and 1,182, but when it is a broken value, for example 22,051.56, the result is 330.77340000000004% and 21,720,787 , would have to show 330.77 and 21.720,79. Is there any way to format this kind of result in javascript or some other way?

var inputs = document.querySelectorAll('form input');
var valor = inputs[0];
var ir = inputs[1];
var liquido = inputs[2];


function formatar$(nr) {
  return nr.toLocaleString('pt-BR');
}

valor.addEventListener('keyup', function() {
  var nr = Number(this.value);
  var _ir = nr * 1.5 / 100;
  ir.value = _ir + '%';
  liquido.value = formatar$(nr - _ir);
});

<form method="post" action="processa.php">
  <label>Valor comissão:</label>
  <input type="text" name="valor_comissao">

  <label>IR:</label>
  <input type="text">

  <label>Valor Líquido:</label>
  <input type="text">

  <button type="submit">Enviar</button>
</form>

javascript html

asked by anonymous 26.09.2017 / 16:22

2 answers

0

var inputs = document.querySelectorAll('form input');
var valor = inputs[0];
var ir = inputs[1];
var liquido = inputs[2];

valor.addEventListener('keyup', function() {
  var nr = Number(this.value);
  var _ir = nr * 1.5 / 100;
  ir.value = _ir.toFixed(2) + '%';
  var liquidos = (nr - _ir).toFixed(2);
  liquidos=liquidos.replace(".", ",");
  liquidos=(liquidos).replace(/\B(?=(\d{3})+(?!\d))/g, ".");
  liquido.value = (liquidos);

});

<form method="post" action="processa.php">
  <label>Valor comissão:</label>
  <input type="text" name="valor_comissao">

  <label>IR:</label>
  <input type="text">

  <label>Valor Líquido:</label>
  <input type="text">

  <button type="submit">Enviar</button>
</form>

We first format the result with toFixed(2) to display with two decimal places. Next we make a replace to replace the dot com decimal separator, and finally we apply the regex (/\B(?=(\d{3})+(?!\d))/g, ".") .

This regex combines recursively - with the flag g (global) - making a positive Lookahead (?=(\d{3})+(?!\d)) - a sequence of 3 digits (\d{3}) since there is no right digit (?!\d) of this sequence - and that not start or end of string \B

Lookahead is a way of marrying strings that have a particular ending or not. It is used (? = ...) for the positive, ie ending with, and (?! ...) for the negative, ie it does not end with.

26.09.2017 / 19:08

C # MVC5 EF - How not to lose data after ModelState validation? How to Capture Command Line Information

score 4 · Accepted Answer

To format simple numbers as a percentage you can use toFixed(2) . To format the value in cash you can set up .toLocaleString() better with minimumFractionDigits and maximumFractionDigits

Example:

const [valor, ir, liquido] = [...document.querySelectorAll('form input')];

function formatar$(nr) {
  return nr.toLocaleString('pt-BR', {
    minimumFractionDigits: 2,
    maximumFractionDigits: 2
  });
}

valor.addEventListener('keyup', function() {
  const nr = Number(this.value);
  const _ir = nr * 1.5 / 100;
  ir.value = _ir.toFixed(2) + '%';
  liquido.value = formatar$(nr - _ir);
});

<form method="post" action="processa.php">
  <label>Valor comissão:</label>
  <input type="text" name="valor_comissao">

  <label>IR:</label>
  <input type="text">

  <label>Valor Líquido:</label>
  <input type="text">

  <button type="submit">Enviar</button>
</form>