如何在angularjs中输入为空时禁用表单提交

如何在angularjs中输入为空时禁用表单提交,angularjs,Angularjs,我有一个表单,我想在输入字段为空时禁用表单提交。我想在用户单击submit按钮时显示一个错误,其中输入字段为空。我不想在默认情况下显示错误 <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; char

我有一个表单,我想在输入字段为空时禁用表单提交。我想在用户单击submit按钮时显示一个错误,其中输入字段为空。我不想在默认情况下显示错误

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="${pageContext.request.contextPath}/js/Registratonvalidation.js"></script>
        <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
        <script>
            angular.module('myApp', []).controller("numOnlyRegex", function ($scope)
            {
                $scope.numOnlyRegex = /^\d{1,6}$/;
            });
        </script>
        <!--<script src="${pageContext.request.contextPath}/numOnlyRegex.js"></script>-->
        <title>Registration Form</title>
    </head>
    <body>
        <div class="container">
            <div class="col-md-6 col-md-offset-3">
                <div class="panel panel-login">
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-lg-12">
                                <h2 class="text-muted">Registration form</h2>
                                <!--onSubmit="return validate()"-->
                                <div ng-app="myApp" ng-controller="numOnlyRegex">
                                    <form name="myForm" action="RegistrationServlet.do" method="POST" novalidate >
                                        First name:<input type="text" class="form-control input-sm" name="uname" ng-pattern="/^[a-zA-Z]{3,20}/" ng-model="uname" placeholder="First Name" required/>
                                        <span style="color:red" ng-show="myForm.uname.$error.pattern">First name cannot be less than 3 letters with no digits</span><br/>
                                        Last name:<input type="text" class="form-control input-sm" name="lname" ng-model="lname" name="uname" ng-pattern="/^[a-zA-]{3,20}/" required placeholder="Last Name"/>
                                        <span style="color:red" ng-show="myForm.lname.$error.pattern">First name cannot be less than 3 letters with no digits</span><br/>
                                        <p>Password:
                                            <input type="password" class="form-control input-sm glyphicon glyphicon-ok" name="pwd" ng-minlength="3" ng-model="pwd" required placeholder="Password"/>
                                            <span style="color:red" ng-show="myForm.pwd.$error.minlength">password cannot be less than 3 letters</span><br/>
                                            Confirm Password:<input type="password" class="form-control input-sm glyphicon glyphicon-ok" name="pwd2" ng-minlength="3" ng-model="pwd2" required placeholder="Confirm Password"/><br/>
                                            <span style="color:red" ng-show="myForm.pwd2.$error.minlength">password cannot be less than 3 letters</span><br/>
                                            Gender: <input type="radio" name="female" ng-model="color" value="female" ng-required="!color"/>Female <input type="radio" name="male" ng-model="color" value="male" ng-required="!color"/>Male <br/><br/>
                                            Mobile:<input type="text" class="form-control input-sm" name="mobile" ng-pattern="/^[7-9][0-9]{1,9}$/" ng-model="mobile" required placeholder="Mobile"/>
                                            <span style="color:red" ng-show="myForm.mobile.$error.pattern">Please enter a valid mobile number</span><br/>
                                            Email:<input type="email" class="form-control input-sm" name="email" ng-pattern="/\S+@\S+\.\S+/" ng-model="email" required placeholder="Email"/>
                                            <span style="color:red" ng-show="myForm.email.$error.pattern">Invalid email address</span><br/>
                                            Address:<textarea class="form-control input-sm" name="address" ng-model="address" required placeholder="Address"></textarea>
                                            <span style="color:red" ng-show="myForm.address.$error.require==true">Address cannot be empty</span><br/>
                                            Street:<input type="text" class="form-control input-sm" name="street" ng-model="street" required placeholder="Street"/>
                                            Area:<input type="text" class="form-control input-sm" name="area" ng-model="area" required placeholder="Area"/>

                                            City:   <select name="city" class="form-control" ng-model="city" required>
                                                <option value="hyderabad">Hyderabad</option>
                                                <option value="secunderabad">Secunderabad</option>
                                                <option value="delhi">Delhi</option>
                                                <option value="mumbai">Mumbai</option>
                                            </select><br/>
                                            State: <input type="text" class="form-control input-sm" name="state" ng-model="state" required placeholder="State"/>
                                            Country: <input type="text" class="form-control input-sm" name="country" ng-model="country" required placeholder="Country"/>
                                            Pin:<input type="text" class="form-control input-sm" ng-pattern="numOnlyRegex" name="pin" ng-model="pin" required placeholder="Pin"/>
                                            <span style="color:red" ng-show="myForm.pin.$error.pattern">Only six-digit number is allowed</span>
                                            <input type="Submit" class="form-control btn btn-success" value="Submit" />
                                            <!--ng-disabled="myForm.$invalid"-->
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>            
    </body>
</html>

角度.module('myApp',[]).controller('numOnlyRegex',function($scope)
{
$scope.numOnlyRegex=/^\d{1,6}$/;
});
登记表
登记表
名字:
名字不能少于3个没有数字的字母
姓氏: 名字不能少于3个没有数字的字母
密码: 密码不能少于3个字母
确认密码:
密码不能少于3个字母
性别:女男

流动电话: 请输入有效的手机号码
电邮: 无效的电子邮件地址
地址: 地址不能为空
街道: 面积: 城市: 海得拉巴 塞康德拉巴德 德里 孟买
声明: 国家: 别针: 只允许使用六位数字

删除表单上的
novalidate
ng禁用
,并且已经有
所需的html选项
修复了我的问题

$scope.cityArray=[“海得拉巴”、“塞昆德拉巴德”、“德里”、“孟买”];
 $scope.cityArray= ["hyderabad","secunderabad","delhi","mumbai"];  

<select ng-model = "city" ng-options="city for city in cityArray" name='city'>
</select>

您可以使用HTML的必填字段..我已经使用了必填字段,当输入字段为empty@ShubhamNigam所需选项不适用于下拉选择。有什么想法吗?
必需
选项不适用于下拉选择。有什么想法吗?当我尝试这种方法时,下拉列表是空的。我如何使它成为
必需的
。我试过
,但没有,所以我现在有一个新问题。删除
ng disabled
提供了在提交时检查空字段所需的功能,但现在不正确的条目不起作用,因为用户可以提交带有不正确条目的表单,因为按钮未被禁用
 $scope.cityArray= ["hyderabad","secunderabad","delhi","mumbai"];  

<select ng-model = "city" ng-options="city for city in cityArray" name='city'>
</select>