Home >> FAQs/Tutorials >> XHTML Tutorials and Tips >> Index

XHTML 1.0 Tutorials - Understanding Forms and Input Fields

By: FYICenter.com

Part:   1   2  3  4  5  6  7  8  9  10  11  12  13  14  15  16  17  18  19  20  21  22  23  24  25 

A collection of 25 FAQs/tutorials tips on XHTML forms and input fields. Clear answers are provided with tutorial exercises on forms and input fields: form elements and submission methods; input elements and input types like text, password, radio, checkbox, hidden, submit, file, image, button; dropdown lists and text areas; multiple forms. Topics included in this collection are:

  1. What Is a FORM Tag/Element?
  2. What Are the Attributes of a FORM Element?
  3. What Is an INPUT Tag/Element?
  4. How Many Input Types Are Supported by INPUT Elements?
  5. How To Use "text" Input Fields?
  6. How To Use "password" Input Fields?
  7. How To Use "checkbox" Input Fields?
  8. What Are the Values Submitted on Checkbox Fields?
  9. How To Use "radio" Input Fields?
  10. What Are the Values Submitted on Radio Button Fields?
  11. How To Use "submit" Input/Action Fields?
  12. What Are the Values Submitted on Submit Button Fields?
  13. How To Use "reset" Input/Action Fields?
  14. How To Use "file" Input Fields?
  15. How To Use "hidden" Input Fields?
  16. How To Use "image" Input Fields?
  17. What Are the Values Submitted on Image Button Fields?
  18. How To Use "button" Input Fields?
  19. What Is a TEXTAREA Tag/Element?
  20. What Are the Attributes of a TEXTAREA Element?
  21. What Is a SELECT Tag/Element?
  22. What Is an OPTION Tag/Element?
  23. What Is a LABEL Tag/Element?
  24. Can Two Forms Be Nested?
  25. Do Broswers Support Multiple Forms?

Please note that all notes and tutorials are based on XHTML 1.0 specification.

What Is a FORM Tag/Element?

A "form" element is a block element that you can use to define an input form with input fields. Here are basic rules about a "form" element:

  • "form" elements are block elements.
  • A "form" element can have empty content.
  • A "form" element can have block elements as sub-elements.
  • A "form" element can not have inline elements as sub-elements.
  • A "form" element can not have text as content.
  • A "form" element can not be nested in another "form" element.
  • A "form" element is invisible in browsers.
  • A "form" element has a required attribute called "action" specifing the URL of the form processing program.

Here is a simple example of a "form" element:

<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
 <head>
  <title>Simple Form</title>
 </head>
 <body>
  <h4>Online Survey</h4>
  <form action=""><p>
   FYIcenter.com is your favorite resource site<br/>
   <input type="submit" value="OK"/>
  </p></form>
 </body>
</html>

If you save the above document as simple_form.html, and view it with Internet Explorer, you will see an OK button which is part of a simple form as shown below:
            Simple Form

(Continued on next part...)

Part:   1   2  3  4  5  6  7  8  9  10  11  12  13  14  15  16  17  18  19  20  21  22  23  24  25 


Selected Developer Jobs:

More...