Subject: Require specific input format on text field
Steve,
This is extremely simple to do using JavaScript for either the Notes Client or Web-based applications – use Regular Expressions. Here are some examples – I have not included the exact one you are looking for – hopefully you will see a pattern in the examples and see where to make the change. Also – At the user’s request, I put this in the field’s onChange event – it could be placed elsewhere…
I wrote this to FORMAT a phone number on a form that was being used in the Notes Client (only) for data entry – they were to input exactly 10 numeric digits in the Phone Number field, with NO FORMATTING, so I did not have to bother checking for all possible ways they could have entered a phone number.
SECOND FUNCTION – User decided they wanted to be able to enter the phone number as 1234567890 or 123.456.7890 or 123-456-7890. All three formats could easily be accommodated in just a few lines but I wanted to keep it simple for the other developers on the team which were not used to the concept of Regular Expressions.
The first example function expects 10 numeric digits. If it gets what it wants it formats them as:
(123) 456-7890
Else it simply leaves the value alone. I’ll do the actual validation (for values that are NOT exactly 10 numeric digits) in the LotusScript code that runs during QuerySave.
Field’s onChange event (MAKE SURE YOU SELECT CLIENT if it is a Notes Client application)
this.value = validateTenDigits( this.value )
JS Header (MAKE SURE YOU SELECT CLIENT if it is a Notes Client application)
function validateTenDigits( inputPhoneNumber ) {
regExp = /\d{10}/;
if( regExp.test( inputPhoneNumber ) ) {
phone = "(" + inputPhoneNumber.substring(0,3) + ") " + inputPhoneNumber.substring(3,6) + "-" + inputPhoneNumber.substring( inputPhoneNumber.length - 4, inputPhoneNumber.length );
return phone;
} else {
return inputPhoneNumber;
}
}
SECOND FUNCTION — HANDLES ADDITIONAL FORMATS
The user can enter the phone number as:
1234567890
123.456.7890
123-456-7890
And with a VERY SIMPLE change they could also enter it as:
(123) 456-7890
Change the code in the field’s onChange event to:
this.value = FormatPhoneNumber( this.value )
function FormatPhoneNumber( inputPhoneNumber ) {
// 10/21/2007 Gary Roberts
// Used to format Phone Number when user enters correct number of numeric digits (and possibly correct delimiters)
// This could be done in just a couple of lines but I wanted to keep it simple for other developers who might not be
// used to matching/replacement using Regular Expressions
var PhoneWasFormatted = false;
// Formats allowed:
regExp_AllNumeric = /\d{10}/; // 1234567890
regExp_WithDots = /\d{3}.\d{3}.\d{4}/; // 123.456.7890
regExp_WithDashes = /\d{3}-\d{3}-\d{4}/; // 123-456-7890
if( regExp_AllNumeric.test( inputPhoneNumber ) ) {
phone = "(" + inputPhoneNumber.substring(0,3) + ")" + inputPhoneNumber.substring(3,6) + "-" + inputPhoneNumber.substring( inputPhoneNumber.length - 4, inputPhoneNumber.length );
return phone;
} else if( regExp_WithDots.test( inputPhoneNumber ) ) {
phone = "(" + inputPhoneNumber.substring(0,3) + ")" + inputPhoneNumber.substring(4,7) + "-" + inputPhoneNumber.substring( inputPhoneNumber.length - 4, inputPhoneNumber.length );
return phone;
} else if( regExp_WithDashes.test( inputPhoneNumber ) ) {
phone = "(" + inputPhoneNumber.substring(0,3) + ")" + inputPhoneNumber.substring(4,7) + "-" + inputPhoneNumber.substring( inputPhoneNumber.length - 4, inputPhoneNumber.length );
return phone;
} else {
// If we didn't match one of the formats allowed, we will return the input unchanged and let QuerySave validate it and inform the user
return inputPhoneNumber;
}
}
function FormatSSN( inputSSN ) {
// Used to format SSN when user enters correct number of numeric digits
regExp = /\d{9}/;
if( regExp.test( inputSSN ) ) {
SSN = inputSSN.substring(0,3) + "-" + inputSSN.substring(3,5) + "-" + inputSSN.substring( inputSSN.length - 4, inputSSN.length );
return SSN;
} else {
return inputSSN;