Some masks for InputMask (field with dynamic input mask)

[Didou12]

Here some masks you can use.

Note :
- mask : is the mask (it's not a regex) with definitions
- greedy (default true) : false or true, if true "mandatory and non-variable characters" of a mask (such as a space (postal code) or a dash (phone number)) are automatically filled in.
- clearIncomplete (default false) : true or false, if true when the input loses the focus (user clicks outside) and the mask is not complete, the field is automatically cleared.
- definitions : is authorized characters for the mask.
- casing : upper or lower, make the charactes in uppercase; so you can define a validator like [A-Za-z] (user can types upper or lower characters), and the characters are automatically in uppercase.

• For a USA/Canada postal code

Code: Select all

{
  mask: 'A9A 9A9',
  clearIncomplete: true,
  definitions: {
    'A': {
      validator: "[A-Za-z]",
      casing: "upper"
    },
    '9': {
      validator: "[0-9]"
    }
  }
}

• Characters A-Z or a-z, 0 to 5 characters, automatically in uppercase

Code: Select all

{
  mask: "*{0,5}",
  greedy:false,
  definitions: {
    '*': {
      validator: "[a-zA-Z]",
      casing: "upper"
    }
  }
}

• One dash or none

Code: Select all

{
  mask: "*{0,1}",
  greedy:false,
  definitions: {
    '*': {
      validator: "[-]"
    }
  }
}

• 1 or more numbers (no limitation)

Code: Select all

{
  mask: "*{1,}",
  greedy:false,
  definitions: {
    '*': {
      validator: "[0-9]"
    }
  }
}

Hope it can help

[brave]

Hello and thank you for letting us be a part of it. I use your code to learn and understand, that always helps me a little bit further in my concerns. Simply tool!

[Didou12]

My pleasure,

I will edit my post in the next few days to add a method to have dynamic mask based on value from a field.