HTML and CSS Reference
In-Depth Information
Alice has obtained some regular expressions for phone numbers, postal codes, and
Red Ball Pizza receipt numbers. You'll add these regular expression patterns to the
phone
,
zip
, and
receipt
fields, and then test them in your browser. Note that some of
the regular expressions are long and complicated, and you must type them exactly as
written. If you make a mistake, you can copy the text of the regular expressions from the
regex.txt
file in the tutorial.06/tutorial folder.
The
pattern
attribute can
be used only with input
boxes that store text. You
cannot use it with other
data types.
To apply and test regular expression patterns:
◗
1.
Return to the
survey.htm
file in your text editor.
◗
2.
Within the
input
element for the
zip
field, insert the following regular expression
pattern that tests for the presence of a five- or nine-digit postal code:
pattern=”^\d{5}(\-\d{4})?$”
◗
3.
Go to the
input
element for the
phone
field. Change the data type from
type=”tel”
to
type=”text”
and add the following attribute that tests for a valid
phone number pattern:
pattern=”^\d{10}$|^(\(\d{3}\)\s*)?\d{3}[\s-]?\d{4}$”
◗
4.
Scroll down to the
input
element for the
receipt
field and insert the following
attribute that tests for a valid receipt number:
pattern=”^re\-\d{6}$”
Figure 6-70 highlights the revised text in the file.
figure 6-70
specifying character patterns with regular expressions
regular expression
for a five- or
nine-digit postal code
data type
changed to text
regular expression
for a phone number
regular expression
for a Red Ball Pizza
receipt number
◗
5.
Save your changes to the file and then refresh
survey.htm
in your Web browser.
Enter some text in the Name input box.
You can provide a more
descriptive error message
by adding the
title
attri-
bute to the
input
element
along with the text of your
error message.
◗
6.
Type
321
in the input box for the postal code and then submit the form. As shown
in Figure 6-71, the browser rejects the field value because it does not match the
pattern of either a five-digit or a nine-digit postal code.
