没有提交按钮的表单验证angularjs

问题描述

我要验证没有提交按钮的表单.

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>

如何将userlogin(email)，firstname和speciality字段设置为强制性，必须将email字段验证为电子邮件.通常我们如何验证没有提交按钮的表单.即，当我单击创建新用户"链接时，应验证表单.

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.

我们可以在没有控制器的情况下在html本身中对表单进行客户端验证吗?

Can we do the client side validation of the form in the html itself without the controllers?

谢谢

推荐答案

在$ formName.$ valid中使用所有必需的输入字段都需要必填属性.

Use in $formName.$validAll 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的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！