braintree / restricted-input

Restrict <input>s to certain valid characters (e.g. formatting phone or card numbers)
https://braintree.github.io/restricted-input/
MIT License
68 stars 25 forks source link

Lack of documentation on how patterns usage #12

Closed ilinieja closed 8 years ago

ilinieja commented 8 years ago

Our team has the situation where we need to use restricted-input's module to edit Braintree hosted fields' validation rules (yeah, it's weird, but it happened so and we really need some info). We haven't found documentation on how to use patterns used for default validation rules, example usage: this.formatter.setPattern('{{99}} / {{9999}}'); and when we try to use regexps (like /^\d{5}(?:[-\s]\d{4})$/) we've got error Uncaught Error: A valid pattern string is required or if we use it in quotes regexp isn't working as expected and just appears in input on keydown. So, could you, please help us clarify how are patterns intended to use. For example of what info we need, currently our goal is to set pattern for optional characters: it should accept 5 numbers or 5 numbers + hyphen + 4 numbers (postal code format), regexp way to do it is /^\d{5}(?:[-\s]\d{4})$/.

EvanHahn commented 8 years ago

We use this library internally for Hosted Fields formatting, but it is not exposed to our public interface. We don't currently support changing the patterns used in Hosted Fields.

setPattern and the initial pattern takes a string, not a regular expression—our docs on the readme are incorrect. You can see examples of these patterns in test/support/index.html—see the data-pattern attributes on the inputs. For example, {{9}} specifies a digit, {{99}} specifies two digits, {{A}} specifies a single letter, and so on. We'll update our docs with more detail.

Thanks for reporting this—it's now on our list to fix up the readme.