WML provides various options to let a user enter information through WAP application.
First of all, we are going to look at the different options for allowing the user to make straight choices between items. These are usually in the form of menus and submenus, allowing users to drill down to the exact data that they want.
The <select>...</select> WML elements are used to define a selection list and the <option>...</option> tags are used to define an item in a selection list. Items are presented as radiobuttons in some WAP browsers. The <option>...</option> tag pair should be enclosed within the <select>...</select> tags.
This element support the following attributes:
Attribute | Value | Description |
---|---|---|
iname | text | Names the variable that is set with the index result of the selection |
ivalue | text | Sets the pre-selected option element |
multiple |
| Sets whether multiple items can be selected. Default is "false" |
name | text | Names the variable that is set with the result of the selection |
tabindex | number | Sets the tabbing position for the select element |
title | text | Sets a title for the list |
value | text | Sets the default value of the variable in the "name" attribute |
xml:lang | language_code | Sets the language used in the element |
class | class data | Sets a class name for the element. |
id | element ID | A unique ID for the element. |
Following is the example showing usage of these two elements.
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN" "http://www.wapforum.org/DTD/wml12.dtd"> <wml> <card title="Selectable List"> <p> Select a Tutorial : <select> <option value="htm">HTML Tutorial</option> <option value="xml">XML Tutorial</option> <option value="wap">WAP Tutorial</option> </select> </p> </card> </wml>
When you will load this program, it will show you the following screen:
Once you highlight and enter on the options, it will display the following screen:
You want to provide option to select multiple options, then set multiple attribute to true as follows:
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN" "http://www.wapforum.org/DTD/wml12.dtd"> <wml> <card title="Selectable List"> <p> Select a Tutorial : <select multiple="true"> <option value="htm">HTML Tutorial</option> <option value="xml">XML Tutorial</option> <option value="wap">WAP Tutorial</option> </select> </p> </card> </wml>
This will give you a screen to select multiple options as follows:
The <input/> element is used to create input fields and input fields are used to obtain alphanumeric data from users.
This element support the following attributes:
Attribute | Value | Description |
---|---|---|
name | text | The name of the variable that is set with the result of the user's input |
maxlength | number | Sets the maximum number of characters the user can enter in the field |
emptyok |
| Sets whether the user can leave the input field blank or not. Default is "false" |
format | A a N X x M m *f nf |
Sets the data format for the input field. Default is "*M".
A = uppercase alphabetic or punctuation characters |
size | number | Sets the width of the input field |
tabindex | number | Sets the tabbing position for the select element |
title | text | Sets a title for the list |
type |
| Indicates the type of the input field. The default value is "text". Password field is used to take password for authentication purpose. |
value | text | Sets the default value of the variable in the "name" attribute |
xml:lang | language_code | Sets the language used in the element |
class | class data | Sets a class name for the element. |
id | element ID | A unique ID for the element. |
Following is the example showing usage of this element.
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN" "http://www.wapforum.org/DTD/wml12.dtd"> <wml> <card title="Input Fields"> <p> Enter Following Information:<br/> Name: <input name="name" size="12"/> Age : <input name="age" size="12" format="*N"/> Sex : <input name="sex" size="12"/> </p> </card> </wml>
This will provide you the following screen to enter required information:
The <fieldset/> element is used to group various input fields or selectable lists.
This element support the following attributes:
Attribute | Value | Description |
---|---|---|
title | text | Sets a title for the list |
xml:lang | language_code | Sets the language used in the element |
class | class data | Sets a class name for the element. |
id | element ID | A unique ID for the element. |
Following is the example showing usage of this element.
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN" "http://www.wapforum.org/DTD/wml12.dtd"> <wml> <card title="Grouped Fields"> <p> <fieldset title="Personal Info"> Name: <input name="name" size="12"/> Age : <input name="age" size="12" format="*N"/> Sex : <input name="sex" size="12"/> </fieldset> </p> </card> </wml>
This will provide you the following screen to enter required information. This result may differ browser to browser.
The <optgroup/> element is used to group various options together inside a selectable list.
This element support the following attributes:
Attribute | Value | Description |
---|---|---|
title | text | Sets a title for the list |
xml:lang | language_code | Sets the language used in the element |
class | class data | Sets a class name for the element. |
id | element ID | A unique ID for the element. |
Following is the example showing usage of this element.
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN" "http://www.wapforum.org/DTD/wml12.dtd"> <wml> <card title="Selectable List"> <p> <select> <optgroup title="India"> <option value="delhi">Delhi</option> <option value="mumbai">Mumbai</option> <option value="hyderabad">Hyderabad</option> </optgroup> <optgroup title="USA"> <option value="ohio">Ohio</option> <option value="maryland">Maryland</option> <option value="washington">Washingtone</option> </optgroup> </select> </p> </card> </wml>
When a user loads above code, then it will give two options to be selected:
When a user selects any of the options, then only it will give final options to be selected. So if user selects India, then it will show you following options to be selected: