In this section, we will learn what novalidate attribute is and to how to use it.

What is novalidate Attribute in HTML <form> Tag?

The novalidate attribute is used to turn off the validation of data in a form.

You see, HTML elements like textbox (<input type = “text”>) password-box, checkboxes etc. have attributes that help us to require users to add the necessary data to these input elements.

For example, if there’s a textbox in a form and we want users to fill that box, we can add an attribute called `required` to that element. If now users left that box empty, browsers automatically highlight the textbox and show an error message to users reminding them that they need to fill the box. Essentially, the form data won’t be sent to a server unless users fill the target element with the correct data.

But sometimes, for whatever reason, we might want to disable any auto data validation in a form.

This is where we can use the `novalidate` attribute in the target <form> element. After using this attribute, the form data won’t be validated anymore.

HTML novalidate Attribute in <form> Tag Syntax:

<form novalidate> </form>

<form> Tag novalidate Attribute Values

The novalidate attribute does not take any value. Simply put, this attribute in the opening tag of HTML <form> element.

Example: using novalidate attribute in HTML <form> tag

See the Pen using novalidate attribute in HTML <form> tag by Omid Dehghan (@odehghan) on CodePen.

In this example, the Input box for username has an attribute named `required`. This means this particular input box needs to be filled with data. It doesn’t say what kind of data, but there should be something in the textbox. Otherwise, the form won’t submit to a server and browsers will highlight this textbox because it wasn’t filled with data.

But here, because we used the `novalidate` attribute in the <form> element, this validation check is neutralized and so even with no data for the username textbox, still we can submit the form data to a server.