Money(Currency) Mask Library In Vanilla JavaScript – SimpleMaskMoney

Category: Form , Javascript | February 23, 2019

2 Comments

Demo Download

AUTHOR:	codermarcos
VIEWS TOTAL:	7,331 views
OFFICIAL PAGE:	Go to website
LAST UPDATE:	February 23, 2019
LICENSE:	MIT

---

Preview:

Description:

A vanilla JavaScript input mask library that masks data entry in an input field in the form of money.

Supports custom prefix, suffix, decimal/thousand separators as well as precision.

Also works with Angular, React and Vue.js frameworks.

How to use it:

Import the JavaScript file ‘simple-mask-money.js’ into the document.

<script src="simple-mask-money.js"></script>

Create a numeric input on the page.

<input inputmode="numeric" id="myInput" value="0,00"><br>

Activate the money mask on the input field.

let input = SimpleMaskMoney.setMask('#myInput');

Default configurations to customize the SimpleMaskMoney.

let input = SimpleMaskMoney.setMask('#myInput',{
    prefix: '',
    suffix: '',
    fixed: true,
    fractionDigits: 2,
    decimalSeparator: ',',
    thousandsSeparator: '.',
    emptyOrInvalid: () => {
      return this.SimpleMaskMoney.args.fixed
        ? `0${this.SimpleMaskMoney.args.decimalSeparator}00`
        : `_${this.SimpleMaskMoney.args.decimalSeparator}__`;
    }
});

Changelog:

v3.0.0 (02/23/2019)

• correcting quality code

v2.0.0 (09/24/2018)

• Correct bug fractional digits

v1.2.0 (09/18/2018)

• Add support for cursor movement.

v1.1.1 (09/07/2018)

• update version, update thanks text, improving tests, removing webpack

v1.0.0 (06/04/2018)

• Removing autoCompleteDecimal

v0.2.0 (05/22/2018)

• adding tests and support browsers