Example for readonly and disabled attributes

The below is the static form with html code snippet that is used for this example. The reason for providing the code snippet is that one can access the source code easily even if it is viewed in the mobile platforms. In general, it might not be very easy to access the source code of the form when this is viewed in the mobile platforms. This example makes you understand how the read only and disabled attributes are exposed when you run the screen reader on this form across all the platforms.

First Name

last Name

Age
10203040

Select Gender

Male
Female

I have a bike
I have a car

Source Code

<br /> <label for="fname"> First Name </label><br /> <input type="text" id="fname"/readonly><br /> <label for="lname"> last Name </label><br /> <input type="text" id="lname"/readonly><br /> <label for="age"> Age </label><br /> <select id="age" disabled><option value="10">10</option><option value="20">20</option><option value="30">30</option><option value="40">40</option></select></p> <fieldset> <legend> Select Gender </legend> <p><input type="radio" name="sex" id="mm" checked> <label for="mm"> Male </label><br /> <input type="radio" name="sex" id="nn"> <label for="nn"> Female </label><br /> </fieldset> <p><input type="checkbox" name="vehicle1" id="pp"> <label for="pp"> I have a bike </label><br /> <input type="checkbox" name="vehicle2" id="pp1"> <label for="pp1"> I have a car </label><br /> <input type="submit"/> <input type="button" value="reset"><br />