JSPM

  • Created
  • Published
  • Downloads 2320
  • Score
    100M100P100Q116748F
  • License Apache-2.0

Simple money mask developed with pure JavaScript. To run on Client Side and Server Side

Package Exports

  • simple-mask-money
  • simple-mask-money/lib/simple-mask-money.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (simple-mask-money) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

SimpleMaskMoney

WARNING

if you are having problems check the version you are using. The docs to old (2.x.x) version stay here

NPM

build Status npm version npm Downloads Codacy Badge License

Simple money mask developed with pure JavaScript. To run on Client Side and Server Side. Try live demo

Getting Started

First install it:

  npm i simple-mask-money --save

Or access the GitHub release directly:

<script src="https://github.com/codermarcos/simple-mask-money/releases/download/<RELEASE_VERSION_HERE>/simple-mask-money.js"></script>

Remember to replace with the latest version

Read the docs or chose your implementation:

Here is a usage example:

  <body>
    <!-- Set inputmode to numeric to show only numbers on mobile -->
    <input id="myInput" inputmode="numeric" value="0,00">

    <script src="./node_modules/simple-mask-money/lib/simple-mask-money.js"></script>
    
    <script>
      // configuration
      const args = {
        afterFormat(e) { console.log('afterFormat', e); },
        allowNegative: false,
        beforeFormat(e) { console.log('beforeFormat', e); },
        negativeSignAfter: false,
        prefix: '',
        suffix: '',
        fixed: true,
        fractionDigits: 2,
        decimalSeparator: ',',
        thousandsSeparator: '.',
        cursor: 'move'
      };

      // Select the element
      const input = SimpleMaskMoney.setMask('#myInput', args);
      // Convert the input value to a number, which you can save e.g. to a database:
      input.formatToNumber();

    </script>
  </body>

Or if you prefer use the methods in your events

  <body>
    <!--  Set inputmode to numeric to show only numbers on mobile -->
    <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 = {
        afterFormat(e) { console.log('afterFormat', e); },
        allowNegative: false,
        beforeFormat(e) { console.log('beforeFormat', e); },
        negativeSignAfter: false,
        prefix: '',
        suffix: '',
        fixed: true,
        fractionDigits: 2,
        decimalSeparator: ',',
        thousandsSeparator: '.',
        cursor: 'move'
      };

      input.oninput = () => {
        input.value = SimpleMaskMoney.format(input.value);
      }

      // Your send method
      input.onkeyup = (e) => {
        if (e.key !== "Enter") return;
        // Returns the value of your input as a number:
        SimpleMaskMoney.formatToNumber(input.value);
      }
    </script>
  </body>