作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我能够验证我的 AngularStrap datetimepicker,但我无法区分所需的验证失败和无效的日期失败。屏幕上显示的唯一错误是必需的错误,无论它是必需的还是无效的字符串。在输入的字符串无效的情况下,是否有可能显示不同的验证消息?这是我的代码:
<div class="control-group" ng-class="{error: form.BirthDate.$invalid}">
<label class="control-label" for="BirthDate">{{'_BirthDate_' | i18n}}</label>
<div class="controls">
<input id="BirthDate" name="BirthDate" title="BirthDate" type="text" ng-model="user.BirthDate" data-date-format="dd/mm/yyyy" bs-datepicker required>
<span ng-show="form.BirthDate.$dirty && form.BirthDate.$error.required">{{'_BirthDateRequired_' | i18n}}</span>
<!--<span ng-show="form.BirthDate.$dirty && form.BirthDate.$error.pattern">{{'_BirthDateInvalid_' | i18n}}</span>-->
</div>
</div>
最佳答案
首先,我认为这与日期选择器没有真正的联系,如果我理解你的问题,你试图根据导致 $invalid for the form 的错误显示不同的消息
如果是这种情况,您提供的代码只会在日期无效时显示一条消息(但只是因为您评论了模式的部分;))
我在测试时非常懒惰,所以我没有使用日期选择器,你必须手动输入日期,但我做了这个 fiddle :http://jsfiddle.net/DotDotDot/ELf5A/2/
由于我不知道您在什么情况下使用它,因此我使用了不同的方法来显示验证错误消息
HTML 部分很简单。有一个表单,需要两个字段,一个用于日期的模式检查,另一个仅用于所需的验证。我为日期添加了 2 条错误消息,一条在未触及表单时显示,告诉您预期的格式,另一条仅在模式错误时显示。
您可以单击按钮来检查整个验证,然后显示另一条消息,该消息将告诉您表单是否有效,如果无效,则是因为日期模式。
<div ng-controller='theCtrl'>
<form name='theForm'>
Enter something here : <input type='text' ng-model='someField' name='someField' required /> <br/>
Enter a date here : <input type='text' ng-model='theDate' name='theDate' ng-pattern='datePattern' required />
<span ng-show='theForm.theDate.$error.pattern'>Your date format is invalid, please check it again</span>
<span ng-show='theForm.theDate.$pristine'>Enter a valid date here : DD/MM/YYYY</span>
<br/> <input type='button' ng-click='validation(theForm)' value='Try to validate me!' />
<br /> {{errorMsg}}
</form>
</div>
$scope.validation=function(aForm){
//console.log(aForm)
if(aForm.theDate.$error.pattern)
$scope.errorMsg='The pattern you entered isn\'t good enough, try again !'
else{
if(aForm.$invalid)
$scope.errorMsg='Something is invalid, please check all the fields !'
else//valid
{
$scope.errorMsg='Not bad !'
alert("good job !")
//maybe you can also submit this form here ;)
}
}
}
$scope.whatToDisplay=function(aForm){
if(aForm.$valid)
return 'valid';
if(aForm.theDate.$error.pattern)
return 'date';
if (aForm.$invalid)
return 'notdate';
}
<span ng-show='whatToDisplay(theForm)=="date"'>Displayed if the date is wrong</span>
<span ng-show='whatToDisplay(theForm)=="notdate"'>This is displayed if the form is invalid, but not because of the date format</span>
<span ng-show='whatToDisplay(theForm)=="valid"'>Displayed if the form is valid</span>
关于angularjs - 如何为 AngularStrap datetimepicker 显示 'invalid date' 验证消息,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17897847/
我是一名优秀的程序员,十分优秀!