When you have a form on your page you should include preset defaults. Doing this may reduced the amount of input the user may have to enter, thus providing a better user-experience. This test checks that you have provided defaults in your form elements where appropriate. The test is not run if the page does not contain a form.
Providing defaults
To pass this test you should check that all radio buttons and select menus have a default value selected
Radio buttons
To provide a default value for a set of radio buttons, you use the checked attribute with the desired default radio control element. An example is given below:
|
1 |
<input type="radio" name="sex" value="male"/> |
|
1 |
<input type="radio" name="sex" value="female" checked="checked" /> |
Note that both radio controls have the same name, that is how they are associated, but only one has the checked=checked attribute.
Note that in HTML it is permitted to use the attribute checked without an assignment. However, this is not allowed in XHTML, hence you must use checked="checked"
Incorrect:
|
1 |
<input type="radio" name="sex" value="female" checked /> |
Correct:
|
1 |
<input type="radio" name="sex" value="female" checked="checked" /> |
Select menus
To provide a default value in a select menu, you use the selected attribute with the desired default option element of the menu. An example is given below:
|
1 2 3 4 5 6 |
<select name="fruits"> <option value="apples">Apples</option> <option value="oranges" selected="selected">Oranges</option> <option value="bananas">Bananas</option> <option value="pears">Pears</option> </select> |
Note that in HTML it is permitted to use the attribute selected without an assignment. This is not allowed in XHTML, so you must use selected="selected":
Incorrect:
|
1 |
<option value="oranges" selected>Oranges</option> |
Correct:
|
1 |
<option value="oranges" selected="selected">Oranges</option> |
Reference
This test is based on a W3C mobileOK best practise test. See http://www.w3.org/TR/mobile-bp/#PROVIDE_DEFAULTS for more details
