19.2. Controlling the
Type and Number of Characters to be Entered in Input Fields (format
Attribute)
The
format attribute of the
<input> element is used to control the type and number of
characters that can be entered in an input field. The format
attribute takes a number of format characters as its value.
Each format character has a certain meaning. The value of the format
attribute is called the input mask.
The
following table shows the format characters available (Note: format
characters are case-sensitive) and their corresponding meanings:
Format
characters
|
Usage
|
a
|
It
is used to represent any lowercase letter or symbolic character.
|
A
|
It
is used to represent any uppercase letter or symbolic character.
|
n
|
It
is used to represent any numeric or symbolic character.
|
N
|
It
is used to represent any numeric character.
|
x
|
It
is used to represent any lowercase letter, numeric or symbolic
character.
|
X
|
It
is used to represent any uppercase letter, numeric or symbolic
character.
|
m
|
It
is used to represent any character. The WAP browser will be in the
lowercase input mode by default but it can be changed to other
input modes manually.
|
M
|
It
is used to represent any character. The WAP browser will be in the
uppercase input mode by default but it can be changed to other
input modes manually.
|
Here
are two WML examples that illustrate the usage of the format
attribute:
<input
name="name" format="NN"/>
Meaning:
You must enter 2 numeric characters in the input field created by the
above WML markup.
<input
name="name" format="AAAAA"/>
Meaning:
You must enter 5 uppercase letters or symbolic characters in the
input field created by the above WML markup.
It
is a good practice to set an input mask for an input field, since the
input mode (alphanumeric mode, numeric mode, etc) of a mobile phone's
keypad will be set automatically according to the input mask. It is a
very convenient feature for the users of your mobile Internet
application. For example, if the input mask is "NN" (it
specifies that the text field can only accept 2 numeric characters),
a mobile phone's keypad will be set to the numeric mode
automatically. If you press a key of the mobile phone, no alphabets
or symbols can be outputted.
A
single numeric character can be added before a format character in an
input mask. For example:
<input
name="name" format="2N"/>
It
means a user can enter a maximum of 2 numeric characters in the input
field. (Notice that the meaning of "2N" is different from
that of "NN".)
Also,
you can add the * character before a format character in an input
mask. For example:
<input
name="name" format="*N"/>
It
means there is no limit in the number of numeric characters that can
be entered.
Another
example is:
<input
name="name" format="A*a"/>
It
means the user must:
Enter
one uppercase character (or symbolic character), and then
Enter
zero or more lowercase character (or symbolic character)
The
input mask "A*a" can be applied to text fields that are
used to obtain the name of a user. It ensures that the first
character must be in uppercase. For example, a user can only enter
"Peter" but not "peter".
The
default value of the format
attribute is "*M".
The
following two rules should be followed when adding a numeric
character or the * character before a format character:
You
can only use such character combination once in the input mask.
You
can only use such character combination at the end of the input
mask.
Here
are some examples of invalid input mask:
format="9N9N"
-- Reason: You can only use 9N once in the input mask.
format="*Naa*N"
-- Reason: You can only use *N once in the input mask.
format="9NNNN"
-- Reason: You can only use 9N at the end of the input mask. The
correct one should be "NNN9N".
format="*NA"
-- Reason: You can only use *N at the end of the input mask.
If
a value of invalid syntax is assigned to the format
attribute, WAP browsers will ignore it.
Escaped
characters can be included in an input mask. To escape a character,
you put a single backslash (i.e. \) in front of that character.
Why
do we need escaped characters in the input mask? Look at this example
and you will understand. Let's say you want a user to enter a date of
the form MM/DD/YYYY and you specify "NN\/NN\/NNNN" as the
input mask. If the user uses the Openwave Mobile Browser, the /
character will be inserted automatically at the third and the sixth
character position of the input field as he/she types the date. If
the user uses the Nokia Mobile Browser, the / character will not be
inserted automatically but the browser will forbid the user to enter
characters other than / at the third and the sixth character
positions. The escaped characters in this example ensure that the
third and sixth characters must be /.
Feedback Form ( ExpandCollapse)
|