skip to Main Content

Consider the following minimal example. I’m using imask.js to restrict input field values. But sometimes I just don’t care about the value and would like to allow anything.

If I don’t set a value for the mask property it throws an error because it is required in the configuration:

Uncaught Error: mask property should be defined at maskedClass

So I figured out a workaround with a custom block mask: {}. But it still shows warnings and doesn’t look like a solid solution to me.

What is the correct way to define a mask that allows any value?

IMask(document.getElementById("input"), {
  mask: "Digit here: 0. Anything here: anything",
  lazy: false,
  blocks: {
    anything: {
      mask: {}
    }
  }
});
input { width: 50vw; padding: 10px; font-size: large; box-sizing: border-box; }
<script src="https://unpkg.com/imask"></script>
<input id="input"/>

2

Answers


  1. You can make anything be the whole mask:

    IMask(document.getElementById("input"), {
      mask: "anything",
      lazy: false,
      blocks: {
        anything: {
          mask: {}
        }
      }
    });
    input { width: 50vw; padding: 10px; font-size: large; box-sizing: border-box; }
    <script src="https://unpkg.com/imask"></script>
    <input id="input"/>
    Login or Signup to reply.
  2. As suggested by @GetSet, you could use a RegExp mask that matches anything :

    IMask(document.getElementById("input"), {
      mask: "Digit here: 0. Anything here: anything",
      lazy: false,
      blocks: {
        anything: {
          mask: /(.*?)/
        }
      }
    });
    input { width: 50vw; padding: 10px; font-size: large; box-sizing: border-box; }
    <script src="https://unpkg.com/imask"></script>
    <input id="input"/>

    See this question if you want more examples of RegExp that matches anything.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search