JavaScript Forms Collection

An HTML document can contain more than one form where a user can enter the data. This allows a developer to organize an HTML form as required in the web application. The question is how to refer to all these different forms in a single HTML page>?  For such a case you can use JavaScript Forms Collection. It represents all the form objects defined in an HTML page. It is an object reference for all the form elements defined with in  <FORM> </FORM> tags in an HTML page.

So, it means you can define multiple forms like Login Form, Data Entry Form, and Search or Logout section and use data from any of these forms submitted by user.

Properties of Forms Collection

Like other JavaScript Objects the JavaScript Forms collection has many properties for a form object.

action

Action property accepts a url or name of script file to which the form data will be submitted. It can be an .asp or .php script file.

elements

This is an array of form controls or form objects that are presented to the user. It can be a collection of data entry form elements.

encoding

The script or the destination url needs to identify the MIME type of the data submitted from the HTML form. Encoding property is used to set the MIME type. The type submitted by form can be a data, a document, image or a video.

length

length property specifies the count of form elements in a Forms Collection element.

name

name property specifies the name of a specific form object of a Forms Collection.

target

target property specifies the target window to display the output of a specific form object of a Forms Collection. The allowed options are (_blank, _self, _top, _parent)

Methods of Forms Collection

Methods in JavaScript are used to perform a predefined action on a JavaScript object. In case of forms collection, two methods can be used.

reset()

This method does not require any arguments. When called this method resets the form for which it is called. It results in clearing the HTML form input fields.  

submit()

This method also does not require any arguments. When called this method submits the form data to the target url and passes the data of the HTML form input fields.