首页 > Web开发 > 详细

angular js input校验只能输入数字和字母 directive写法一则

时间:2016-09-09 18:41:56      阅读:1789      评论:0      收藏:0      [点我收藏+]
js代码:
.directive(‘validateNumberLetter‘, function () {
return {
require: ‘ngModel‘,
link: function (scope, elm, attrs, ctrl) {
scope.$watch(attrs.ngModel, function(n){
if(!n) return;
var oldName = attrs.validateNumberLetter;
if(oldName !== n){
var reg=/[^A-Za-z0-9]/;
if (n.length) {
if(reg.test(n)){
// it is invalid, return undefined (no model update)
ctrl.$setValidity(‘validateNumberLetter‘, false);
return undefined;
}else{
// it is valid
ctrl.$setValidity(‘validateNumberLetter‘, true);
return n;
}
}
}
});
}
};
})
html代码:
<div class="form-group-right">
<input required validate-number-letter
    id="name"
name="name"
class="form-control verify-input"
type="text"
ng-model="volume.name"
ng-maxlength="255"
ng-disabled="context.mode === ‘extend‘ ||
context.mode === ‘attach‘ ||
context.mode === ‘detach‘"
placeholder="{% trans ‘enter a volume name‘ %}"/>
<p class="help-block alert-fixed alert-danger"
ng-show="form.name.$error.required && form.name.$dirty">
{% trans "A volume name is required." %}
</p>
<p class="help-block alert-fixed alert-danger"
ng-show="form.name.$error.maxlength && form.name.$dirty">
{% trans "Name length should be less than 255 chars." %}
</p>
<p class="help-block alert-fixed alert-danger"
ng-show="form.name.$error.validateNumberLetter && form.name.$dirty">
{% trans "should be letter" %}
</p>
</div>

angular js input校验只能输入数字和字母 directive写法一则

原文:http://www.cnblogs.com/braveliuchina/p/5857500.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!