Angular ui: bootstrap 日期选择器输入验证
Angular ui: bootstrap datepicket input validation
我正在使用这个 datepicker。截至目前,用户可以在输入字段中输入他喜欢的任何内容,这不是我想要的。
我的代码:
session.js
session.getDateFormat = function() {
return 'yyyy-MM-dd';
};
session.formatDate = function(date) {
return $filter('date')(date, session.getDateFormat());
};
Controller.js
vm.dateFormat = session.getDateFormat();
function submit() {
date : session.formatDate(vm.data.date)
}
代码要长得多,但基本上是关于日期的部分。并且 HTML
<input type="text" class="form-control" uib-datepicker-popup="{{vm.dateFormat}}" placeholder="{{vm.dateFormat}}" ng-model="vm.data.date" is-open="vm.dateOpened" ng-required="true" ng-disabled="disabled" />
管理员可以选择是否希望 getDateFormat 接受 yyyy-mm-dd
或 dd-mm-yyyy
等
我想要的:
- 验证用户输入的日期格式是否正确,否则自动清除该字段并显示错误消息以及正确的日期格式作为提示给用户。在按下提交之前必须完成所有这些。
- 明显不允许用户输入字母
- 没有硬编码 html 正则表达式,我想要一些东西来检查输入是否与 getDateFormat 相同,否则清除该字段并显示错误。
- 没有Jquery,整个项目我都没有用Jquery
- 如果您有任何其他可以与 angular 和 bootstrap 一起使用但不使用 Jquery 的日期选择器,请告诉我。
我不得不更新到 angular-ui 1.3.3 然后我不得不给日期输入一个名字 'datepicker' 和一个名字 'frm'然后
<div ng-if="!frm.datepicker.$error.required"">
<div class="datepicker-error" ng-if="frm.datepicker.$invalid">
some error message
</div></div>
我没有清除该字段,因为如果用户没有完成输入,它将无效,因此可能会被清除。如果有人有更好的解决方案,请告诉我。
我正在使用这个 datepicker。截至目前,用户可以在输入字段中输入他喜欢的任何内容,这不是我想要的。
我的代码:
session.js
session.getDateFormat = function() {
return 'yyyy-MM-dd';
};
session.formatDate = function(date) {
return $filter('date')(date, session.getDateFormat());
};
Controller.js
vm.dateFormat = session.getDateFormat();
function submit() {
date : session.formatDate(vm.data.date)
}
代码要长得多,但基本上是关于日期的部分。并且 HTML
<input type="text" class="form-control" uib-datepicker-popup="{{vm.dateFormat}}" placeholder="{{vm.dateFormat}}" ng-model="vm.data.date" is-open="vm.dateOpened" ng-required="true" ng-disabled="disabled" />
管理员可以选择是否希望 getDateFormat 接受 yyyy-mm-dd
或 dd-mm-yyyy
等
我想要的:
- 验证用户输入的日期格式是否正确,否则自动清除该字段并显示错误消息以及正确的日期格式作为提示给用户。在按下提交之前必须完成所有这些。
- 明显不允许用户输入字母
- 没有硬编码 html 正则表达式,我想要一些东西来检查输入是否与 getDateFormat 相同,否则清除该字段并显示错误。
- 没有Jquery,整个项目我都没有用Jquery
- 如果您有任何其他可以与 angular 和 bootstrap 一起使用但不使用 Jquery 的日期选择器,请告诉我。
我不得不更新到 angular-ui 1.3.3 然后我不得不给日期输入一个名字 'datepicker' 和一个名字 'frm'然后
<div ng-if="!frm.datepicker.$error.required"">
<div class="datepicker-error" ng-if="frm.datepicker.$invalid">
some error message
</div></div>
我没有清除该字段,因为如果用户没有完成输入,它将无效,因此可能会被清除。如果有人有更好的解决方案,请告诉我。