HTML FORMS:

In this chapter we are going to cover: Introduction to HTML Forms. HTML Form elements. HTML Form input types. HTML Form input attributes. HTML input attributes.

INTRODUCTION TO HTML FORM: An HTML form is used to collect user input and the user input is most often sent to a server for processing. Always note that “Forms are enclosed in the HTML

element”. Best example of collecting user input is logging in to any website. The below is the example of the collection of user input:

                             First Name:     R.Hari
                             Second Name: Narayanan 

                    In the above instance you saw the example of user input, Also Forms can be made up of standard graphical user interface elements such as: Text Fields, Checkboxes, Radio buttons, Submit buttons, etc.

HTML FORM ELEMENTS:

                    Ok learners,  I believe that you got the right picture of what is HTML Form. Now we can discuss about HTML Form Elements and it’s uses:

- This tag creates a simple text box that allows input of a single line of text. - This tag is a type of that requires a sectionally validated email address. - This tag is a type of that requires a number. -This tag is used for security purposes. - This tag creates a radio button. - This tag is used to upload files. -This tag is used to restore the user input values. - This tag is used to send the user input to the server.

- This tag displays a drop-down list that displays a list of items a user can select from.

       One of the most often used form element is  “ <input> element.” The below points are the example for input element:

                      <label for="firstname"> First name:</label>
                      <input type="text" id="firstname" name="firstname">

HTML FORMS: INPUT TYPES:

- This input type is used to create buttons in the form.

- This input type is used to create a checkbox button in the form.

- This input type is used for input fields that should contain a color.

- This input type is used to display date in the form.

- This input type is used to display date and time in the form.

- This input type is used to collect the user’s email address and it is sent to the server.

- This input type is used to upload the files in the form.

- This type is used to allow users to upload image.

- This input type allows the user to select month and year.

- This input type allows the users to enter numeric characters in the form.

- This input type is used to create a password field in the form.

- This input type is used to create radio buttons in the form.

- This input type is used to restore the user input values.

- This input type allows the users to search the content.

- This input type is used to create a submit button in the form to send the user response to the server.

- This input type is used to collect the user’s telephone number.

- This input type is used to create a single line text input field in the form.

- This input type is used to display time to the user.

HTML FORMS: INPUT ATTRIBUTES: Value Attribute - The value attribute specifies the value of an element. Readonly Attribute - users can only read the text, that is it cannot be modified. Disabled Attribute - It is used to disable the element. Size Attribute - It is used to change the font size. Maxlength Attribute - It is used to define the maximum number of characters. Min and Max Attributes - It is used to specify minimum and maximum values for an input field. In short: It is used to show the maximum and minimum number of the characters should be typed by the users. Multiple Attribute - It allows the user to type more than one value in the input field. Pattern Attribute - Pattern attribute works with text, date, search, url, tel, email, and password. Placeholder Attribute - It displays a short description about how the user should give input in the input field. Required Attribute - it is used to specify that an input field must be filled out before submitting the form. Step Attribute - It is used to set legal number intervals. Autofocus Attribute - It sets the attention on that specific component when the page loads. Height and width Attributes - The height and width attributes are only relevant on and image buttons. List Attribute - An element which contains predefined lists is known as list element. Autocomplete Attribute - Autocomplete allows the browser to predict the value and fills the word automatically in the input field.