HTML 5 required validator triggers on all buttons on the form

问题

 <asp:TextBox ID="txtCompanyName" runat="server" placeholder="Company Name" BorderColor="#C2C4CC" BorderStyle="Solid" Height="28px" Width="135px" title="Enter Company Name"  BackColor="#F9E3CB" Enabled="False" TabIndex="7" required></asp:TextBox>

Here is the mark up for one of my textbox with the "required" attribute.

My question is, I have 3 buttons on my form, cancel, reset and submit button. the html5 required validator should only trigger when the submit button is clicked. however, it still triggers even if I press cancel and reset buttons.

How can I assign html 5 required validator on only one button?

here is my markups for my buttons:

Cancel Button:

<asp:ImageButton ID="Cancel" runat="server" ImageUrl="~/Images/ClaimForm/btnCancel.gif" OnClick="btnFallBack_Click" Visible="False" ToolTip="Cancel" draggable="false" />

Reset Button:

<asp:ImageButton ID="btnClear" runat="server" OnClick = "OnConfirm" OnClientClick = "Confirm()" ImageUrl="~/Images/ClaimForm/Clear.jpg" draggable="false"/>

Submit Button

<asp:ImageButton ID="btnNext" runat="server" ImageUrl="~/Images/ClaimForm/submitbutton.jpg" draggable="false" OnClick="btnNext_Click"/>

回答1:

Add formnovalidate tag in each buttons html code.

<asp:ImageButton ID="Cancel" runat="server" ImageUrl="~/Images/ClaimForm/btnCancel.gif" OnClick="btnFallBack_Click" Visible="False" ToolTip="Cancel" draggable="false" formnovalidate="formnovalidate" />

回答2:

I solved it by assigning an onclick function to that button and adding:

event.preventDefault();

回答3:

try this.

use a input button - where set the type as button and make it to run as server

ex: // this will trigger the required for text boxes

//this button will not.

来源：https://stackoverflow.com/questions/20159772/html-5-required-validator-triggers-on-all-buttons-on-the-form