Sams Teach Yourself JavaScript in 24 Hours

By Michael Moncur

• Table of Contents
  • Copyright
  • About the Author
  • Acknowledgments
  • We Want to Hear from You!
  • Reader Services
  • Introduction
  • Part I: Getting Started
  • Hour 1. Understanding JavaScript
  • Hour 2. Creating a Simple Script
  • Hour 3. How JavaScript Programs Work
  • Part II: Learning JavaScript Basics
  • Hour 4. Using Functions and Variables
  • Hour 5. Using Strings and Arrays
  • Hour 6. Testing and Comparing Values
  • Hour 7. Repeating Yourself: Using Loops
  • Hour 8. Using Math and Date Functions
  • Part III: The Document Object Model (DOM)
  • Hour 9. Working with the Document Object Model
  • Hour 10. Responding to Events
  • Hour 11. Using Windows and Frames
  • Hour 12. Getting Data with Forms
    • The Basics of HTML Forms
    • Using the form Object with JavaScript
    • Scripting Form Elements
    • Displaying Data from a Form
    • Sending Form Results by Email
    • Workshop: Validating a Form
    • Summary
    • Q&A
    • Quiz
    • Exercises
  • Hour 13. Using Graphics and Animation
  • Part IV: Moving on to Advanced JavaScript Features
  • Hour 14. Creating Cross-Browser Scripts
  • Hour 15. Creating Custom Objects
  • Hour 16. Working with Sounds and Plug-Ins
  • Hour 17. Debugging JavaScript Applications
  • Part V: Working with Dynamic HTML (DHTML)
  • Hour 18. Working with Style Sheets
  • Hour 19. Using Dynamic HTML (DHTML)
  • Hour 20. Using Advanced DOM Features
  • Part VI: Putting It All Together
  • Hour 21. Improving a Web Page with JavaScript
  • Hour 22. Creating a JavaScript Game
  • Hour 23. Creating DHTML Applications
  • Hour 24. JavaScript Tips and Tricks
  • Part VII: Appendices
  • Appendix A. Other JavaScript Resources
  • Appendix B. Tools for JavaScript Developers
  • Appendix C. Glossary
  • Appendix D. JavaScript Quick Reference
  • Appendix E. DOM Quick Reference

The Basics of HTML Forms

Forms are among the most useful features of the HTML language. As you'll learn during this hour, adding JavaScript to forms can make them more interactive and provide a number of useful features. The first step in creating an interactive form is to create the HTML form itself.

Defining a Form

An HTML form begins with the <form> tag. This tag indicates that a form is beginning, and it enables form elements to be used. The <form> tag includes three parameters:

• NAME is simply a name for the form. You can use forms without giving them names, but you'll need to assign a name to a form in order to easily use it with JavaScript.
• METHOD is either GET or POST; these are the two ways the data can be sent to the server.
• ACTION is the CGI script that the form data will be sent to when submitted. You can also use the mailto: action to send the form's results to an email address, as described later in this hour.

For example, here is a <form> tag for a form named Order. This form uses the GET method and sends its data to a CGI script called order.cgi in the same directory as the Web page itself:

<form NAME="Order" METHOD="GET" ACTION="order.cgi">

For a form that will be processed entirely by JavaScript (such as a calculator or interactive game), the METHOD and ACTION attributes are not needed. You can use a simple <form> tag that names the form:

<form NAME="calcform">

The <form> tag is followed by one or more form elements. These are the data fields in the form, such as text fields, buttons, and check boxes. In the next section, you'll learn how JavaScript assigns objects to each of the form elements.

Share This