[英]Angular JS and ASP Server Side Control Validation
I am using angular JS for asp.net server side controls 我使用角度JS的asp.net服务器端控件
<div class="gridpage mb40" name="myForm" ng-model="myForm" ng-form
<div class="form-group">
<label class="">Name of the Supplier:</label>
<asp:TextBox ID="txtSupName" CssClass="form-control" runat="server" ng-model="txtSupName" name="txtName" required></asp:TextBox>
<p ng-show="myForm.txtName.$invalid && !myForm.txtName.$pristine" class="help-block">Your Name is Required.</p>
</div>
</div>
problem is at run time when i deploy my code , name property changes for server side control so i am not able to render paragraph of error messages is there any other way through which i can access control instead of myform.txtName.$invalid?? 问题是在运行时,我部署我的代码,名称属性更改为服务器端控件,所以我无法呈现错误消息的段落是否有任何其他方式,我可以访问控制而不是myform.txtName。$ invalid ??
tried with clientIDmode= Static
, it keeps id static but name still changes, 尝试使用clientIDmode= Static
,它保持id静态但名称仍然改变,
Try this solution jsfiddle . 尝试这个解决方案jsfiddle 。
Create a directive alias
, which stores a reference to ngModelController
, which is independent of the name
of input (asp:TextBox). 创建一个指令alias
,它存储对ngModelController
的引用,该引用独立于输入name
(asp:TextBox)。
var myApp = angular.module('myApp', []); myApp.controller('MyCtrl', function($scope, $log) { }) .directive('alias', function() { return { restrict: "A", require: "ngModel", scope: { alias: "=" }, link: function(scope, elem, attr, ngModel) { scope.alias = ngModel; } } });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myApp"> <div ng-controller="MyCtrl"> <form name="myForm"> <input name="txtName" ng-model="txtName" required alias="aliasName" ng-pattern="/^[0-9]+$/"> <div ng-if="myForm.txtName.$error.required">Name is reauired by name</div> <div ng-if="aliasName.$error.required">Name is reauired by alias</div> <div ng-if="myForm.txtName.$error.pattern">Invalid pattern by name</div> <div ng-if="aliasName.$error.pattern">Invalid pattern by alias</div> <br> <pre>myForm.txtName.$error = {{myForm.txtName.$error|json}}</pre> <pre>aliasName.$error = {{aliasName.$error|json}}</pre> </form> </div> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.