Simple money mask developed with pure JavaScript. Try live demo
First, install it.
npm i simple-mask-money --saveThen, use it as follows:
<body>
<!--
Put inputmode numeric to mobile show only numbers
-->
<input id="myInput" inputmode="numeric" value="0,00">
<script src="./node_modules/simple-mask-money/lib/simple-mask-money.js"></script>
<script>
// configuration
let args = {
prefix: '',
suffix: '',
fixed: true,
fractionDigits: 2,
decimalSeparator: ',',
thousandsSeparator: '.'
};
// select the element
let input = SimpleMaskMoney.setMask('#myInput', args);
// This method return value of your input in format number to save in your database
input.formatToNumber();
</script>
</body>Or if you prefer use the methods in your events
<body>
<!--
Put inputmode numeric to mobile show only numbers
-->
<input inputmode="numeric" value="0,00">
<script src="./node_modules/simple-mask-money/lib/simple-mask-money.js"></script>
<script>
// select the element
let input = document.getElementsByTagName('input')[0];
// configuration
SimpleMaskMoney.args = {
prefix: '',
suffix: '',
fixed: true,
fractionDigits: 2,
decimalSeparator: ',',
thousandsSeparator: '.'
};
input.oninput = () => {
input.value = SimpleMaskMoney.format(input.value);
}
// Your send method
input.onkeyup = (e) => {
if (e.key !== "Enter") return;
// This method return value of your input in format number to save in your database
SimpleMaskMoney.formatToNumber(input.value);
}
</script>
</body>