Presentation on theme: "Forms Most application interface with users through a Graphical User Interface (GUI) GUI objects are components that allow users to enter information."— Presentation transcript:
Forms Most application interface with users through a Graphical User Interface (GUI) GUI objects are components that allow users to enter information. They are largely standard across many modern applications A form is a collection of GUI objects that work together to interact with a user and accomplish a task.
Examples of GUI Components Text Text area Clickable Components Radio button Check box General Buttons Drop down menu Reset and submit
The Input Tag math yes Use this tag to create most of the GUI components Note: hidden components are useful for adding data to a form that a user does not have to enter, like time of day.
Creating a group of radio buttons yes no maybe Notes 1.Users can select ONLY one of a group of related ratio buttons. In the above example, clicking on 'no' will deselect 'yes' 2.The name attribute ties radio buttons together –Related radio buttons set the name attribute value to the same text –The above example uses the attribute value: 'group'. 3.The value attribute is needed to submit properly
Creating a Group of Check Boxes math english science Notes 1.You can click more than one check box. 2.The name attribute can have different values
Creating a Drop Down Menu coke Pepsi Dr. Pepper Notes 1.The tag must have a name attribute, or it will not submit 2.You need the value attribute for proper form submission. coke Pepsi Dr. Pepper
Text areas and text components Notes 1.Text components only allow users to enter one row of information; the size attribute specifies the width of the component 2.Text areas allow multiple rows using the rows. The cols attribute specifies the width of each row. 3.Text area components use the tag, with its closing counterpart 4.The value attributes for these components contains the data the user types.
Constructing a form in HTML... Insert all your form elements here... Use the form tag makes all of the GUI elements are grouped together in a single unit