Friday, July 16, 2010

Input Mask in InfoPath fields - entering phone numbers and emails

If you have a field in InfoPath where people are supposed to put in their email addresses or a website or phone number - you may have asked whether or not we can double-check that they put it in in a certain way (e.g. a phone number has to be entered in the format (123)555-7899.  There is a way to make this happen - even in browser forms - using something called Regular Expressions.  You won't see the phrase "regular expression" in InfoPath but you will see something like "matches pattern" or "does not match pattern" - which are regular expressions.  Here's the basic way they work:
Using either Conditional Formatting or Data Validation in your InfoPath form, you should have [Field1] [Does not match pattern] [some pattern goes here] - and the action or tooltip should either disable/hide the control or have a message stating something like "Please type your information in the correct format".  Patterns use the following building blocks:

0. If you want to have a symbol for any letter:  \p{L}
1. If you want to have a symbol for any character (letter, number, or symbol):  . (yes, that's a period)
2. If you want to have a symbol for any digit:  \d
3. If you want to use a period, parenthesis, or dash symbol:  \. or \( or \-
4. If you want one of the above to be used a certain number of times, you can use an *, a +, or a ? but they must go AFTER the thing you want to be only used a certain number of times.  * = 0 or more of that thing (e.g. \d* means either no digit up to a huge number - as big as you want).  + = at least 1 or more of that thing (e.g. \d+ means at least 1 digit but can get to be as big as you want).  ? = 0 or 1 of that thing (e.g. \d? means either a single digit or nothing).

So, how does this help you with making people enter phone numbers or emails correctly?  Here's what the patterns should look like:
(for phone numbers):  \d?\(\d\d\d\)\d\d\d\-\d\d\d\d
Notice how there's that optional digit at the beginning for the USA country code?  Obviously, international numbers will be a bit more complicated, but this will make people type in their phone numbers as 1(123)456-7899 or (123)456-7899 - depending on if they want a country code.

For email addresses:
  • See the first period means at least 1 character or more but can be any size.  This works great to make sure they at least type something but it could be anything like jdoe or bob or super_director.  
  • The @ symbol doesn't need anything special so you can just type it.
  • The \p{L}+ means at least 1 character but as many as you need to type your domain like gmail or aol or hotmail or yourcompany
  • The period needs that slash in front of it because periods do other things in regular expressions
  • After the period, there are two \p{L} because almost every ending to an email will have at least 2 letters (e.g. .us, .com, .net, .info, .gov, .edu, .org, etc.)
  • The last two \p{L}'s are followed by a question mark to mean that they are optional but that the most you can have is 4 letters.
So, for something else to try, why not see if you can make a pattern that checks to see if they type a web address correctly (as in, they have to type http(optional 's' here)://(www or some other word).something.something_up_to_4_letters (e.g.  If you want more, look up Regular Expressions or Regex to see what you can accomplish!

RELATED POST:  I have another post about this in regard to limiting the number of characters people are able to type in MULTI-line fields (if you have a regular textbox, there's an easy option to limit the number of characters on the Display tab...but NOT so if you choose to make that textbox multi-line):  Limit number characters in multi-lines of text InfoPath fields