没有提交按钮的表单验证angularjs
[英] form validation angularjs without submit button
本文介绍了没有提交按钮的表单验证angularjs的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想要验证没有提交按钮的表单.
<form novalidate="novalidate" class="form-horizontal"><div class="control-group"><label class="control-label" for="inputUserLogin">用户登录:</label><div class="控件"><input type="email" id="inputUserLogin" ng-model="user.userLogin" placeholder="用户登录" required/>
<div class="control-group"><label class="control-label" for="inputFirstName">名字:</label><div class="控件"><input type="text" id="inputFirstName" ng-model="user.firstName" placeholder="名字"/>
<div><span class="nullable"><select ng-model="user.lookupId" ng-options="select as speciality.lookupName for specialityList" ng-change="selectedSpecilaty()"><option value="">--选择专业--</option></选择></span>
<div>一些额外的其他字段在这里
<div class="control-group"><div class="控件"><a ng-click="cancel()" class="btn btn-info btn-xs">cancel</a><a ng-click="createNewUser()" class="btn btn-small btn-primary">创建新用户</a>
</表单>
如何将userlogin(email)、firstname 和speciality 字段设为必填、email 字段必须作为电子邮件进行验证.通常我们如何对没有提交按钮的表单进行验证.即当我点击创建新用户"链接时，表单应该被验证.
当点击链接后出现错误时，表单应该有正确的字段数据，并且应该只显示错误字段旁边的错误消息或以红色字段显示.
我们可以在没有控制器的情况下对 html 中的表单进行客户端验证吗?
谢谢
解决方案
在 $formName.$valid 中使用所有必要的输入字段都需要必填属性.
http://plnkr.co/edit/6zVqTeW1WARIUcbS7dC9?p=preview
I want validation of the form which do not have the submit button.
<div ng-controller="UserCreationCtrl">
<form novalidate="novalidate" class="form-horizontal">
<div class="control-group">
<label class="control-label" for="inputUserLogin">User Login:</label>
<div class="controls">
<input type="email" id="inputUserLogin" ng-model="user.userLogin" placeholder="User Login" required />
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputFirstName">First name:</label>
<div class="controls">
<input type="text" id="inputFirstName" ng-model="user.firstName" placeholder="First name"/>
</div>
</div>
<div>
<span class="nullable">
<select ng-model="user.lookupId" ng-options="select as speciality.lookupName for speciality in specialityList" ng-change="selectedSpecilaty()">
<option value="">-- choose speciality --</option>
</select>
</span>
</div>
<div> some extra other fields goes here</div>
<div class="control-group">
<div class="controls">
<a ng-click="cancel()" class="btn btn-info btn-xs">cancel</a>
<a ng-click="createNewUser()" class="btn btn-small btn-primary">create new user</a>
</div>
</div>
</form>
</div>
How to make the userlogin(email), firstname and the speciality fields as mandatory, email field must be validated as email. Usually how do we do the validation of the form which do not have the submit button. I.e when I click on the 'create new user' link the form should be validated.
When the errors occured after clicking the link, the form should have correct fields data and it should display only the error messages beside the error fields or display with a field with a red color.
Can we do the client side validation of the form in the html itself without the controllers?
Thanks
解决方案
Use in $formName.$valid
All necessary input fields need required attribute.
<form novalidate="novalidate" class="form-horizontal" name='myForm'>
<a ng-click="createNewUser()" class="btn btn-small btn-primary" ng-disabled="!myForm.$valid">create new user</a>
</form>
http://plnkr.co/edit/6zVqTeW1WARIUcbS7dC9?p=preview
这篇关于没有提交按钮的表单验证angularjs的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
