ng-pattern-restrict
ng-pattern-restrict copied to clipboard
Allow mask support
Provide the ability to create masks along with the input restriction. Something similar to https://github.com/RobinHerbots/jquery.inputmask
I want to participate. Any ideas of how to implement this feature?
@Yankovsky Welcome!
jQuery already has great plugins that provide this functionality, for which the source code can be found here:
- https://github.com/igorescobar/jQuery-Mask-Plugin/blob/master/src/jquery.mask.js
- https://raw.githubusercontent.com/digitalBush/jquery.maskedinput/1.4.0/dist/jquery.maskedinput.js
Based on it, I'd ask (and investigate an answer for) the following questions:
- Would we need to use mask expressions, or can we detect literals in Regexes?
- Every time the value changes, we need to find which is our position in that regex
- If we're into a delimiter position, and the regex allows no more values before the delimiter, advance the cursor and include the delimiter into the string
- What to do if the regex allows for more values? E.g.
\d{0,4}-?\d{5}and our string is currently123|(|would be the cursor).
- How does the API restriction on non-type-text inputs affect us here? Should we "disguise" every input as a type=text? (This is something I was actively avoiding, in order not to affect mobile UX and play nice with other directives.)
- Can we show the mask beforehand, or do we need to calculate it on the fly? Since not every regex will have a fixed number of values before delimiters, can we even determine where they should be placed? (Related to 2.2.)
- How does #15 affect us here?