In this section, we will learn what formnovalidate attribute is and how it works.

What is formnovalidate Attribute in HTML <button> Tag?

The formnovalidate attribute is used to send a form data without checking its values to make sure they are correct!

You’ve probably seen these kinds of forms that won’t allow you to type incorrect data into them. For example, if a text box needs at least 4 characters as its value and instead we left that completely empty and hit the submit button directly, usually a sign of error appears somewhere around that box or even the box itself will turn into red etc. and the form data won’t be sent to the server until these mistakes are fixed.

But if we want to ignore these wrong inputs and send the content of the form without validating it first, we can use the formnovalidate attribute for the <button> element. In that case, any data in the form (even if it’s empty) will be sent to a server without error checking.

HTML formnovalidate Attribute in <button> Tag Syntax:

<button type = "submit" formnovalidate> </button>

<button> Tag formnovalidate Attribute Values

The formnovalidate attribute does not take any value and all we need to do is to simply put this attribute in the opening tag of HTML <button> element.

Example: using formnovalidate attribute in HTML <button> tag

See the Pen using formnovalidate attribute in HTML <button> tag by Omid Dehghan (@odchan1) on CodePen.

In the example above, if you hit the submit button without putting any value for the username textbox, you’ll get an error (usually the textbox will turn into red)

But now let’s add the formnovalidate attribute to the <button> element and see what will happen if we don’t put a value on the username textbox:

See the Pen Untitled by Omid Dehghan (@odchan1) on CodePen.

As you can see, this time if we hit the submit button, the form data will be sent to the server even though there’s no value set for the username textbox!