O'Reilly logo

Learning WML, and WMLScript by Martin Frost

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

The tabindex Attribute

Some browsers can cycle through <input> and <select> in a card using some sort of TAB key or similar control. Normally, the order in which this happens is chosen by the browser (usually the order in which the elements are specified in the card). The tabindex attribute allows this order to be changed for some or all of the elements in a card.

Not all browsers support this feature, as it doesn’t fit into all of the user interfaces. If this feature is supported, the browser sorts all the <input> and <select> elements with a tabindex specified in ascending order. Pressing the TAB key (or whatever normally cycles through such elements) then selects these elements in this order. Any elements in the card without a tabindex specified are selected last.

Example 4.4 shows how this attribute can be used. The user is asked for a normal postal address. Both the county and nation fields have no tabindex: nation because it has a default, and county because it’s usually unnecessary to give a county or state if the postal code is correct. The <do> element at the end calls a WMLScript function to check that the values are acceptable (for example, if no postal code is given, a county is required).

Example 4-4. Use of the tabindex Attribute

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC
    "-//WAPFORUM//DTD WML 1.1//EN"
    "http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
    <card title="Enter address">
        <p>Street:
            <input name="street" tabindex="1"/></p>
        <p>Town/City:
            <input name="town" tabindex="2"/></p>
        <p>County/State/Province:
            <input name="county"/></p>
        <p>Postal/Zip Code:
            <input name="code" tabindex="3"/></p>
        <p>Nation:
            <input name="nation" value="uk"/></p>
        <do type="accept" label="OK">
            <go href="address.wmlsc#check( )"/>
        </do>
    </card>
</wml>

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required