HTML, XHTML and CSS All-In-One for Dummies - Andy Harris [59]
This code shows that check boxes use your old friend the tag:
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
This all seems inconsistent
Sometimes, the value of a form element is visible to users, and sometimes it’s hidden. Sometimes, the text the user sees is inside the tag, and sometimes it isn’t. It’s a little confusing. The standards evolved over time, and they honestly could have been a little more consistent. Still, this is the set of elements you have, and they’re not really that hard to understand. Write forms a few times, and you’ll remember. You can always start by looking over my code and borrowing it as a starting place.
You’re using the same attributes of the tag, but they work a bit differently than the way they do in a plain old text box:
♦ The type is checkbox. That’s how the browser knows to make a check box, rather than a text field.
♦ The checkbox still requires an ID. If you’ll be writing programming code to work with this thing (and you will, eventually), you’ll need an ID for reference.
♦ The value is hidden from the user. The user doesn’t see the actual value. That’s for the programmer (like the select object). Any text following the check box only appears to be the text associated with it.
Creating radio buttons
Radio buttons are used when you want to let the user pick only one option from a group. Figure 7-8 shows an example of a radio button group in action.
Figure 7-8: You can choose only one of these radio buttons.
Radio buttons might seem similar to check boxes, but they have some important differences:
♦ Only one can be checked at a time. The term radio button came from the old-style car radios. When you pushed the button for one station, all the other buttons popped out. I still have one of those radios. (I guess I have a Web-design car.)
♦ They have to be in a group. Radio buttons make sense only in a group context. The point of a radio button is to interact with its group.
♦ They all have the same name! Each radio button has its own ID (like other input elements), but they also have a name attribute. The name attribute indicates the group a radio button is in.
♦ You can have more than one group on a page. Just use a different name attribute for each group.
♦ One of them has to be selected. The group should always have one value and only one. Some browsers check the first element in a group by default, but just in case, you should select the element you want selected. Add the checked = “checked” attribute (developed by the Department of Redundancy Department) to the element you want selected when the page appears. In this example, I preselected the most expensive option, all in the name of good capitalistic suggestive selling.
Here’s some code that explains it all:
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>