JavaScript Form Handling
You can use JavaScript to add interactive effects to your HTML forms.
If you are not familiar with HTML Forms, go through
HTML form tutorial.
The sections below take you through the different interactive effects that you
can give to your HTML forms.
JavaScript Form Validation
The most common use of JavaScript will be to add validations to the form.
It is commonly required to validate the data type, size, pattern etc.
The article
JavaScript Form Validation : quick and easy!
introduces you to the free JavaScript Form Validator script that will
make it a lot easier validate your html forms.
Build Web Forms Faaaast!!
Using Simfatic Forms it is very easy to design, create,
install and maintain web forms; no coding required!
Quickly create your form, install it and receive form
submissions by email.
Click here for more info
Submit Form Using JavaScript
It is commonly required to submit a form programmatically.
The article
"How to submit a form using JavaScript"
explains the different methods to submit a form programmatically.
Email a form using JavaScript
You want the data submitted by the user in the HTML form to be emailed to you.
But, how to do that? Read the article:
Can JavaScript Email a Form?
Information on formmail script is available in:
Sending HTML Form Data to an Email Address
Dynamically changing the action field
You want to send the form data to different cgi-scripts based
on some condition. How to handle such a case?
Read: Switching The HTML Form Action Field Dynamically
Set The Focus on a Particular Element in The Form
The code below shows how to set the focus on an element when
the page is loaded.
<FORM name="myform"
action="submit-form.php">
Name: <input type="text"
name="Name"><br>
Email: <input type="text"
name="Email"><br>
<input type="submit" name="Submit"
value="Submit">
</FORM>
<SCRIPT
language="JavaScript">
document.myform.Name.focus();
</SCRIPT>
See the code above in action:
Example of setting focus on an element in a Form
Using getElementById to get the elements in a form
See: How to use getElementById to get the elements in a form
Setting the value of a form element using JavaScript
- Setting the value of
form element using JavaScript
(textarea and text field)
- Setting the value
of form element using JavaScript
(hidden field)
- Setting the value of form element using JavaScript
(select,list,checkbox and radio button)
Getting the value of a form element using JavaScript
See:
How to get the value of a form element using JavaScript
Using JavaScript to reset or clear a form
See:
Using JavaScript to reset or clear a form
Access form objects when there are multiple forms
See:
Accessing form objects when there are multiple forms
|
|
