HTML Input Forms Attributes

      Comments Off on HTML Input Forms Attributes
Spread the love

HTML forms are essential for collecting and submitting data on the web. The <input> tag is one of the most important tags in an HTML form. In addition to the type attribute, the <input> tag has several other attributes that allow you to customize the form field. Here are some of the most commonly used attributes:

form Attribute

The form attribute specifies which form the input element belongs to. This attribute is useful when you want to associate an input element with a specific form on the page, particularly when multiple forms are present.

html
<form id="form1">
  <input type="text" name="username" form="form1">
</form>

formaction Attribute

The formaction attribute specifies the URL where the form data should be submitted to when the form is submitted.

html
<form action="/submit" method="post">
  <input type="text" name="username">
  <input type="submit" value="Submit" formaction="/submit-now">
</form>

formenctype Attribute

The formenctype attribute specifies the encoding type of the form data when it is submitted to the server.

html
<form action="/submit" method="post" enctype="multipart/form-data">
  <input type="file" name="myFile">
</form>

formmethod Attribute

The formmethod attribute specifies the HTTP method to be used when submitting the form data. The default value is “GET”.

html
<form action="/submit" method="post">
  <input type="text" name="username">
  <input type="submit" value="Submit" formmethod="get">
</form>

formtarget Attribute

The formtarget attribute specifies where to display the response that is received after submitting the form data.

html
<form action="/submit" method="post">
  <input type="text" name="username">
  <input type="submit" value="Submit" formtarget="_blank">
</form>

formnovalidate Attribute

The formnovalidate attribute specifies that the form data should not be validated when submitted. This attribute is useful when you want to submit the form data without performing any validation checks.

html
<form action="/submit" method="post">
  <input type="text" name="username" required>
  <input type="submit" value="Submit" formnovalidate>
</form>

novalidate Attribute

The novalidate attribute specifies that the form data should not be validated when submitted. This attribute is used on individual form fields, rather than the entire form.

html
<form action="/submit" method="post">
  <input type="text" name="username" required novalidate>
  <input type="submit" value="Submit">
</form>

In summary, HTML input form attributes and form attributes are crucial to creating robust and user-friendly forms. Each attribute has a unique purpose and can help you tailor your forms to your specific needs. By using these attributes, you can create forms that collect data effectively and efficiently.