如何不验证具有必需属性的 HTML5 文本框答案

【问题标题】：How not to validate HTML5 text box with required attribute如何不验证具有必需属性的 HTML5 文本框
【发布时间】：2013-08-14 16:43:26
【问题描述】：

我的表单中有一个 HTML 文本框（用于数量）和两个 HTML 按钮（添加、取消）。

<form>
    <input type="number" min="1" max="100" required />
    <button type="button">Add</button>
    <button type="button">Cancel</button>
</form>

我不希望我的第二个按钮（取消）在单击时验证表单。

这可能吗？在 ASP.NET 中，我可以使用 CausesValidation="false" 来不触发验证。

【问题讨论】：

阅读材料：stackoverflow.com/questions/11761202/…

标签： html button required

【解决方案1】：

试试这个。它工作正常。它将在提交按钮上工作

<asp:TextBox runat="server" ID="inputusername" required />

【讨论】：

【解决方案2】：

在asp.net 5enter link description here按钮控件试试这个代码

<form>
<input type="number" min="1" max="100" required />
<button type="button">Add</button>
<button type="button" formnovalidate="formnovalidate">Cancel</button>

阿尔多·弗洛雷斯·雷耶斯 @alduar .net news

【讨论】：

【解决方案3】：

如果您的输入按钮为runat=server，那么您必须具有属性causesvalidation="false"，否则如果您只是使用html 输入类型按钮进行取消，请使用javascript 在单击取消时重定向到您的页面。

例如。 1)

<input type="button" id="btnCancel" class="button blue" value="Cancel" **causesvalidation="false"** onserverclick="btnCancel_Click" runat="server" />

2)

<input type="button" id="btnCancel" class="button blue" value="Cancel" **onclick="GoTo();"**/>

<script type="text/javascript">
function GoTo() {
            window.location.href = '../default.aspx';
        }
</script>

【讨论】：

【解决方案4】：

您可以在取消按钮上使用 formnovalidate-option，如下所示：

<input name="cancel" type="submit" value="Cancel" formnovalidate/>

见Symfony2 form validation with html5 and CANCEL button

【讨论】：

【解决方案5】：

试试这个；

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

我更改了您的代码：你想要的是你的表单不应该在点击取消时被验证，所以这就是我将 formnovalidate 添加到按钮取消的原因。

<form>
    <input type="number" min="1" max="100" required />
    <input type="submit">Add</input>
    <input type="submit" formnovalidate>Cancel</input>
</form>

【讨论】：

哪个适合用？ formvalidate 还是 novalidate？
混合你的 2 个答案... formnovalidate :)
不适用于 ASP.NET ImageButton，即使我为 IE11 添加了 CausesValidation="false" 和 formnovalidate

【解决方案6】：

尝试将formnovalidate 属性添加到您的取消按钮

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

【讨论】：