The value Attribute
The value attribute is used to specify the initial value of an input field:
The readonly Attribute
The readonly attribute is used to specify that the input field is read only (which cannot be changed or modified):
value is not need for the readonly attribute. It can be written as same as readonly="readonly".
The disabled Attribute
The disabled attribute is used to disable the input field.
A disabled element cannot be used i.e they are un-usable and un-clickable.
submission of Disabled elements cannot be done too.
value is not needed for the disabled attribute. It can be written as same as readonly="disabled".
The size Attribute
The size attribute is used to specify input field size(for the characters):
The maxlength Attribute
The maxlength attribute is used to specify the input fields maximum allowed length:
when a maxlength attribute is specified, the input control will not be accepting more than the characters allowed number.
the following attributes has been added for HTML5 for<input>:
and the following attributes are added for <form>:
The autocomplete Attribute
The autocomplete attribute is used to specify if a form or input field must be having autocomplete on or off.
When autocomplete is switched on, the browser will complete values automatically based on the values that the user has entered in the past.
Tip: Autocomplete can be in "on" status for the form, and "off" status for specific input fields, or vice versa.
The autocomplete attribute works along with <form> and the <input> types as the following: text, search, url, tel, range, email, datepickers, password, and color.
An HTML form with autocomplete on (and off for one input field):
Tip: In few browsers you will have to activate the autocomplete function for this to work.
The novalidate Attribute
The novalidate attribute belongs to the <form> attribute.
if it is present, novalidate indicated that during submission, form data must not be validated.
Indicates that during submission the form is not to be validated:
The autofocus Attribute
The autofocus attribute belongs to a boolean attribute.
if it is present, it indicated that an <input> element should automatically receive focus when the page is loading.
the "First name" input field should be automatically getting focus when the page loads:
The form Attribute
The form attribute is used to specify one or more forms an <input> element is belonging to.
Tip: For refering more than one form, using a space-separated list of form ids is required.
A HTML form has an input field which is located outside (but the input field is a part of the form):
The formaction Attribute
The formaction attribute is used to specify the file URL which will process the input control during the submission of the form.
the action attribute of the <form> element is overrided by the formaction attribute overrides
The formaction attribute consists of type="submit" and type="image".
An HTML form with two submit buttons, with different actions:
The formenctype Attribute
The formenctype attribute is used to specify how the form-data needs to be encoded during submition to the server (applicable for forms with method="post").
the enctype attribute of the <form> element is overridden by the formenctype attribute
The formenctype attribute is utilised with type="submit" and type="image".
Send form-data which is default encoded (the first submit button), and is also encoded as "multipart/form-data" (the second submit button):
The formmethod Attribute
The formmethod attribute is used to define the HTTP method inorder to send form-data to the action URL.
the method attribute of the <form> element is overridden by the formmethod attribute overrides .
The formmethod attribute is used with type="submit" and type="image".
the HTTP method of the form is overridden by the second submit button.
The formnovalidate Attribute
The novalidate attribute is known as a boolean attribute.
If it is, it is used to specify that the <input> element must not be validated during submission.
the novalidate attribute of the <form> element is overridden by the formnovalidate attributes.
The formnovalidate attribute is used with the type="submit".
A form having two submit buttons i.e with and without validation:
The formtarget Attribute
The formtarget attribute is used tospecify a name or a keyword which indicates the response display which is received after form submission.
the target attribute of the <form> element is overridden by the formtarget attribute.
The formtarget attribute is utilised with type="submit" and type="image".
A form that is having two submit buttons, having different target windows:
The height and width Attributes
The height and width attributes is used for specifing the height and width of an <input> element.
The attributes - height and width are utilised only used with <input type="image">.
The size of images should be always indicated. If the size is known properly by the browser, flickering will occur while loading of the images.
Defining of an image for the submit button, with height and width attributes:
The list Attribute
The list attribute indicated to a <datalist> element that is having pre-defined options for an <input> element.
An <input> element with pre-defined values in a <datalist>:
The min and max Attributes
The min and max attributes is used to specify the maximum and minimum value for an <input> element.
The max and min attributes are used with the following input types: number, range, date, datetime, datetime-local, month, time and week.
<input> elements with min and max values:
The multiple Attribute
The multiple attribute is known a boolean attribute.
if it is present, it will specify that the user can be allowed to enter more than one value in the <input> element.
The multiple attribute is used with the following input types: email, and file.
A file upload field which will accept multiple values:
The pattern Attribute
The pattern attribute is used to specify a regular expression which is checked against the <input> element's value.
The pattern attribute uses the following input types: text, search, url, tel, email, and password.
Tip:The global title attribute needs to be used for describing the pattern that will help the user.
An input field that can contain only three letters (no numbers or special characters):
The placeholder Attribute
The placeholder attribute is used to specify a hint which describes inputs field's expected valueb (a sample value or a short description of the format).
The hint will be displayed in the input field when the user is going to enter a value.
The placeholder attribute will work with the input types as follows: text, search, url, tel, email, and password.
An input field having a placeholder text:
The required Attribute
The required attribute is known as a boolean attribute.
if it is present, it is used to specify that an input field should be filled before form submition.
The required attribute will work with the input types as follows: text, search, url, tel, email, password, date pickers, number, checkbox, radio, and file.
A required input field:
The step Attribute
The step attribute is used to specify intervals of the legal number for an <input> element.
Example: if step="3", legal numbers that can be used are -3, 0, 3, 6, etc.
Tip: The step attribute is also used along with the max and min attributes for creating a range of legal values.
The step attribute can work with the input types as follows: number, range, date, datetime, datetime-local, month, time and week.
An input field given using a specified legal number intervals: