Here’s the code for the fieldset demo (fieldsetDemo.html on this book’s CD-ROM):
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
Personal Data
Name
Address
Phone
Figure 7-2: This form has a legend and labels.
The form has these elements:
♦ The
♦ The tag: A part of the fieldset, this tag allows you to specify a legend for the entire fieldset. The legend is visible to the user.♦ The paragraphs: I sometimes place each label and its corresponding input element in a paragraph. This provides some nice formatting capabilities and keeps each pair together.♦ The tag: This tag allows you to specify a particular chunk of text as a label. No formatting is done by default, but you can add formatting later with CSS.♦ The elements: The user types data into these elements. For now, I’m just using very basic text inputs so the form has some kind of input. In the next section, I explain how to build more complete text inputs.Building Text-Style InputsMost of the form elements are variations of the same tag. The tag can create single-line text boxes, password boxes, buttons, and even invisible content (such as hidden fields). Most of these objects share the same basic attributes, although the outward appearance can be different.Making a standard text fieldFigure 7-3 shows the most common form of the input element — a plain text field.Figure 7-3: The input element is often used to make a text field.To make a basic text input, you need a form and an input element. Adding a label so that the user knows what he’s supposed to enter into the text box is also common. Here’s the code:“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>textbox.htmlNameid = “txtName“value = “Joe“/>An input element has three common attributes:♦ type: The type attribute indicates the type of input element this is. This first example sets type to text, creating a standard text box. Other types throughout this chapter create passwords, hidden fields, check boxes, and buttons.♦ id: The id attribute creates an identifier for the field. When you use a programming language to extract data from this element, use id to specify which field you’re referring to. An id field often begins with a hint phrase to indicate the type of object it is (for instance, txt indicates a text box).♦ value: This attribute determines the default value of the text box. If you leave this attribute out, the text field begins empty.Text fields can also have other attributes, which aren’t used as often, such as♦ size: This attribute determines the
♦ The paragraphs: I sometimes place each label and its corresponding input element in a paragraph. This provides some nice formatting capabilities and keeps each pair together.
♦ The tag: This tag allows you to specify a particular chunk of text as a label. No formatting is done by default, but you can add formatting later with CSS.♦ The elements: The user types data into these elements. For now, I’m just using very basic text inputs so the form has some kind of input. In the next section, I explain how to build more complete text inputs.Building Text-Style InputsMost of the form elements are variations of the same tag. The tag can create single-line text boxes, password boxes, buttons, and even invisible content (such as hidden fields). Most of these objects share the same basic attributes, although the outward appearance can be different.Making a standard text fieldFigure 7-3 shows the most common form of the input element — a plain text field.Figure 7-3: The input element is often used to make a text field.To make a basic text input, you need a form and an input element. Adding a label so that the user knows what he’s supposed to enter into the text box is also common. Here’s the code:“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>textbox.htmlNameid = “txtName“value = “Joe“/>An input element has three common attributes:♦ type: The type attribute indicates the type of input element this is. This first example sets type to text, creating a standard text box. Other types throughout this chapter create passwords, hidden fields, check boxes, and buttons.♦ id: The id attribute creates an identifier for the field. When you use a programming language to extract data from this element, use id to specify which field you’re referring to. An id field often begins with a hint phrase to indicate the type of object it is (for instance, txt indicates a text box).♦ value: This attribute determines the default value of the text box. If you leave this attribute out, the text field begins empty.Text fields can also have other attributes, which aren’t used as often, such as♦ size: This attribute determines the
♦ The elements: The user types data into these elements. For now, I’m just using very basic text inputs so the form has some kind of input. In the next section, I explain how to build more complete text inputs.
Building Text-Style Inputs
Most of the form elements are variations of the same tag. The tag can create single-line text boxes, password boxes, buttons, and even invisible content (such as hidden fields). Most of these objects share the same basic attributes, although the outward appearance can be different.
Making a standard text field
Figure 7-3 shows the most common form of the input element — a plain text field.
Figure 7-3: The input element is often used to make a text field.
To make a basic text input, you need a form and an input element. Adding a label so that the user knows what he’s supposed to enter into the text box is also common. Here’s the code:
id = “txtName“
value = “Joe“/>
An input element has three common attributes:
♦ type: The type attribute indicates the type of input element this is. This first example sets type to text, creating a standard text box. Other types throughout this chapter create passwords, hidden fields, check boxes, and buttons.
♦ id: The id attribute creates an identifier for the field. When you use a programming language to extract data from this element, use id to specify which field you’re referring to. An id field often begins with a hint phrase to indicate the type of object it is (for instance, txt indicates a text box).
♦ value: This attribute determines the default value of the text box. If you leave this attribute out, the text field begins empty.
Text fields can also have other attributes, which aren’t used as often, such as
♦ size: This attribute determines the