How to Add Currency Format to Result

Question

I want to convert the result into currency format, I have tried many ways but it is not resolved. I'm using jQuery Mask.

This is the result:

HTML Code:

<script src="assets/js/jquery.mask.js"></script>

<div class="container mt-3">
    <form method="POST" action="">
        <div class="form-group">
            <label>Number 1</label>
            <input type="text" class="form-control uang" placeholder="0" id="number1" onkeypress="return OnlyNumber(event)" onkeyup="Calculate();">
        </div>
        <div class="form-group">
            <label>Number 2</label>
            <input type="text" class="form-control uang" placeholder="0" id="number2" onkeypress="return OnlyNumber(event)" onkeyup="Calculate();">
        </div>
        <div class="form-group">
            <label><strong>(Number 1) + (Number 2)</strong></label>
            <p><strong>Result <span id="result">0</span></strong></p>
        </div>
    </form>
</div>

JavaScript Code:

    function Calculate() {
        var Number1 = document.getElementById('number1').value.replace(/\./gi,"");
        var Number2 = document.getElementById('number2').value.replace(/\./gi,"");
        var HitResult = Number(Number1) + Number(Number2);
        if (!isNaN(HitResult)) {
            document.getElementById('result').innerHTML = HitResult;
        }
    }
    function OnlyNumber(evt) {
        var charCode = (evt.which) ? evt.which : event.keyCode
        if (charCode > 31 && (charCode < 48 || charCode > 57)) {
            return false;
            return true;
        }
    }

Another JS in main.js

$(document).ready(function(){
    $( '.uang' ).mask('#.##0', {reverse: true});
})

are you looking for something like this? (https://stackoverflow.com/questions/2901102/how-to-print-a-number-with-commas-as-thousands-separators-in-javascript) — TobiasSchnier, Jan 28 '21 at 12:09
@MisterJojo [jQuery](https://jquery.com/) and [jQuery Mask](https://igorescobar.github.io/jQuery-Mask-Plugin/). — Axel Köhler, Jan 28 '21 at 15:01
jQuery or jQuery Mask doesn't use `uang` class names, what is your framework ? — Mister Jojo, Jan 28 '21 at 15:41
@MisterJojo I use this tutorial for the class name `uang` [This Tutorial](https://masrud.com/post/format-rupiah-input-html) — Rexcuni, Jan 28 '21 at 16:25

score 0 · Accepted Answer · answered Jan 28 '21 at 17:29

Thanks @TobiasSchnier for the reference given, I'm using this answer to solve the case.

By adding this code .toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".") in the specified variable.

For more details like this:

function Calculate() {
    var Number1 = document.getElementById('number1').value.replace(/\./gi,"");
    var Number2 = document.getElementById('number2').value.replace(/\./gi,"");
    var HitResult = Number(Number1) + Number(Number2);
    if (!isNaN(HitResult)) {
        document.getElementById('result').innerHTML = HitResult.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
    }
}

Use this: https://stackoverflow.com/a/2901298/14553270

How to Add Currency Format to Result

1 Answers1