单击不应发送表单的按钮时如何在Angular中关闭表单验证答案

【问题标题】：How to turn off form validation in Angular when clicking by button that shoulden't send form单击不应发送表单的按钮时如何在Angular中关闭表单验证
【发布时间】：2013-12-15 09:18:09
【问题描述】：

我有一个这样的表格：

<form name="myForm"> 
    <input id="myName" ng-model="myName" required/>
    ...
    <button ng-click="doSomePrepare()">Do some prepare</button>
    ...
    <button ng-click="saveForm()" ng-disabled="myForm.$invalid">Save</button>
</form>

我只想在单击“保存”按钮时验证表单。

但是如果我点击“做一些准备”，浏览器（chrome）会要求我填写“myName”输入。

这让我很头疼，因为在现实世界中，“做一些准备”按钮可能是日期选择器按钮或下拉菜单或类似的东西。

附注。我使用的是 Angular 1.2 版本，但据我所知，这可以在 1.0 版中重现

JSfiddle：http://jsfiddle.net/se_panfilov/wQF4S/4/

【问题讨论】：

您的 JSFiddle 根本不使用角度。请改用plnkr.co/edit/UXCBzrAunzY7fmuhSGmE?p=preview。
谢谢，我忘了用 ng-app 包装它。

标签： javascript forms validation angularjs

【解决方案1】：

将您的第一个按钮设为非表单提交按钮：

<button type="button" ng-click="doSomePrepare()">Do some prepare</button>

你可以测试一下here

【讨论】：

【解决方案2】：

默认type attribute of a button tag is submit。尝试将type 设置为reset 或button，以防止在您单击submit 事件时触发它。

工作演示：http://jsfiddle.net/wQF4S/3/

【讨论】：