1 / 11

Comprehensive Guide to HTML Forms: Structure, Fields, and Processing

Explore the basic structure of HTML forms, learn about different form fields, labels, and processing scripts. Understand the types of input methods and how to format the user interface effectively.

barbaragardner
Download Presentation

Comprehensive Guide to HTML Forms: Structure, Fields, and Processing

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. HTML Form Teppo Räisänen LIIKE/OAMK 2011

  2. Basic Structure of a HTML Form • The element defining a form is ’form’ • Form’s most important attributes are • The processing script (action) • Way of transmitting the information (method) • The available transmitting methods are ’get’ ja ’post’

  3. Basic Structure of a HTML Form • A form is one of the block elements, so it can include other block and inline elements • Tables • Paragraphs… • The most primitive form would include a single form field and instructions of use for the field

  4. Types of Form Fields • For input • input • textarea • select • The type attribute is used for more accurate specification • The browsers will generate the forms UI using the information about input types

  5. Types of Form Fields • Submit • Reset • Hidden • Text • Password • Textarea • File

  6. Types of Form Fields • Select • Radio • Checkbox

  7. Labels for Form fields • Information of how to use form fields must be provided for the user • For the information one can use a label element or just simply text inside form • For formatting the final UI a table layout or div elements can be used

  8. Web Forms • HTML forms look lot like printed out forms • The processing of a HTML form is completed by a computer • Form element is used as an interface between the processing side and the user

  9. Web Forms • There are form fields included inside the form for different pieces and types of information • An address of the processing script is written as a part of form element’s declaration • Scripts are small scaled computer programs

  10. Web Forms <form method=”post” action=” http://www.myserver.com/cgi-bin/formprocessing.cgi”><input name=“id" size=“20” /><input type="submit" value=“Send” /></form>

  11. Web Forms • The script for processing can reside in any available server • After submitting the form, the information inside the form is sent for processing • The form data is often ’raw data’ not meant to be analyzed by human resources

More Related