|
|
Lesson 15: Simple text input
This lesson covers user input into text boxes. The basic element for text boxes is the empty tag
<input />
It can take various attributes (most of which are universally supported) to define its initial status and range of possible variables. These are:
|
name
|
the name of the variable to hold the value of the user input. If this variable has already been set, the text box displays this value initially.
|
|
type
|
- defines what type of data this element is to accept. It can either be "text" (the default) or "password". If the latter, the text is obscured in some appropriate way.
|
|
value
|
- provides an optional default value for the element. This value only has effect when the variable given in the name attribute is not set.
|
|
size
|
- specifies how many characters wide the input box should be. Note that this value has no effect on the maximum number of characters that can be entered.
|
|
maxlength
|
- specifies the maximum number of characters that can be entered.
|
|
title
|
- gives a title to the element that some microbrowsers may use in presentation.
|
|
tabindex
|
- specifies the order in which this text box receives the focus when the user presses the 'tab' key. The value used are whole numbers and they are visited in ascending order. Used when there are a number of different text boxes.
|
|
emptyok
|
- "true" allows an empty string as a valid input; "false" will not allow this. Note that the 'format' attribute takes precedence if it is set.
|
|
format
|
- Gives an optional specification of the type of data this element can take. This can be any number or combination of the following legal codes (illegal codes being ignored):
|
A
|
- any uppercase letter or symbol
|
|
a
|
- any lowercase letter or symbol
|
|
N
|
- any numeric digit
|
|
X
|
- any uppercase letter
|
|
x
|
- any lowercase letter
|
|
M
|
- any character, but expecting an uppercase letter
|
|
m
|
- any character, but expecting a lowercase letter
|
|
*f
|
- any number (zero or more) of characters matching format code f, where f is one of the seven given above. E.g., *N matches any number of numeric digits
|
|
nf
|
- exactly n characters matching format code f
|
|
\c
|
-makes character c compulsory, so the browser can fill it in. E.g., given the code \(NNNNN\) NNNNNN, the brackets would be automatically filled in for a telephone number like (01234) 567890
|
|
The following code gives an example of a couple of input boxes.
|
1.
|
<?xml version="1.0"?>
|
|
2.
|
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML
1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
|
|
3.
|
<wml>
|
|
4.
|
<card id="card1" title="Welcome">
|
|
5.
|
<onevent type="onenterforward">
|
|
6.
|
<refresh>
|
|
7.
|
<setvar name="sec" value="Hi"/>
|
|
8.
|
</refresh>
|
|
9.
|
</onevent>
|
|
10.
|
<p>
|
|
11.
|
Number
|
|
12.
|
<input format="N*N" name="first" title="Number:" value="12"/>
|
|
13.
|
Text:
|
|
14.
|
<input format="M*M" name="sec" title="Text:"/>
|
|
15.
|
</p>
|
|
16.
|
</card>
|
|
17.
|
</wml>
|
|
|
Input boxes
|
|
|
|
|
