Question

我正在尝试构建一个angularjs应用程序。我正在使用ui-router在页面之间进行路由。问题是，我为页面做的验证工作正常，但它突然停止工作（我认为路由是使用ui-router实现的）。即使是必填字段，电子邮件等的基本html表单验证也无效。我真的很喜欢angularJs领域。我已经通过这里发布的其他问题并尝试了很多，但都是徒劳的。

这是我的login.html

<div ng-app="app" ng-controller="LoginController">
<form name="MyForm">


    <center>

          <img id="u1_img"  src="images\image.png">

    </center>


    <h1 align="center" style="color:#336BFF;">Sammilana</h1>
    <h3 align="center">Connecting People</h3>
    <center>
    <input type="email"  placeholder="Email" ng-model="login.User.email" required> </br></br>
    <input type= "password"  placeholder="Password" ng-model="login.User.password" required>
    </center>




    <center>

    </br>
    <a ui-sref="profile" class="centerBtn" style="text-decoration:none;">Login</a>
    </br></br>
    </center>


    <center>

    <a ui-sref="welcome" style="color:#80bfff;" ng-click="submitMyForm()">Register</a></br>
    <a ui-sref="forgot" style="color:#80bfff;">Forgot Password</a></br>


    </center>
    </form>
    </div>

SubmitMyForm（）是控制器中写入的函数，用于将值传递给数据库。谁能告诉我哪里出错？

Answer 1

验证失败只会阻止表单提交。您没有提交表单，只需在控制器上调用一个函数。

尝试将ctrl.submitMyForm()移至表单标记：

<form name="MyForm" ng-submit="ctrl.submitMyForm()">

然后添加提交按钮。您只能通过按钮提交表单，而不是锚标记。

<button type="submit">Submit Form</button>

当您点击＆＃34;提交表单＆＃34;按钮，您应该看到验证提示。

但请注意，这是html5浏览器验证，而不是Angular验证。

Answer 2

在表单上使用ng-submit

<form name="MyForm" ng-submit="submitMyForm()">

并在路由中提到的控制器中定义submitMyForm。

还有提交表格所需的提交按钮，否则验证将无效。

您可以通过

检查字段验证

MyForm.:name.$valid

：name是字段名称有许多验证选项，如脏，$有效，$无效等。

您还可以在函数中使用$scope.MyForm.$valid来检查表单是否有效

验证不适用于angularJs应用程序

2 个答案: