AngularJs日期验证;我不适用于IE和Mozilla
AngularJs Validation on Date doesn't work in IE and Mozilla
我的问题是,当我尝试在我的输入类型日期(即birthdate
,当我输入日期(2016年4月29日)时,required仍然显示,它不允许我提交表单。当我尝试删除birthdate
输入上的required属性时,它工作正常。。。但我想要的是使birthdate
成为必需的。。。。我不知道为什么它不能在日期上工作,而它在其他所需的输入上工作得很好,比如full_name
、gender
和email
由于html5在Mozilla和IE中不起作用我使用插件让它工作。
<!--HTML5 Date and Month Input Compatibility-->
<!-- cdn for modernizr-->
<script src="http://cdn.jsdelivr.net/webshim/1.12.4/extras/modernizr-custom.js"></script>
<!-- polyfiller file to detect and load polyfills -->
<script src="http://cdn.jsdelivr.net/webshim/1.12.4/polyfiller.js"></script>
<!--end of compatibility-->
<script>
webshims.setOptions('waitReady', false);
webshims.setOptions('forms-ext', {types: 'date'});
webshims.polyfill('forms forms-ext');
</script>
提交按钮
<button type="submit" form="form-customer"
class="btn btn-primary pull-right" id="cmd_insert_customer" ng-show="tab == 3">
Insert Customer
</button>
FORM
<div class="row" ng-show="tab == 3">
<div class="col-md-12">
<form name="form" ng-submit="form.$valid && insertCustomer(form)" id="form-customer" class="css-form" novalidate >
<div class="row">
<div class="col-xs-4">
<div class="row">
<div class="col-xs-12">
<img src="{{profilePic}}" id="profile_picture" class="img-responsive img-thumbnail" />
</div>
</div>
<div class="row">
<div class="col-xs-12">
<input type="file" name="image_path" id="image" class="form-control" onchange="angular.element(this).scope().uploadFile(this.files)" />
</div>
</div>
</div>
<div class="col-xs-8">
<div class="row">
<div class="col-md-7">
<label>Full Name*
<span class="required-label" ng-show="form.$submitted || form.full_name.$touched">
<span ng-show="form.full_name.$error.required">(Full Name is required.)</span>
</span>
</label>
<input type="text" ng-model="insertProfile.full_name" name="full_name" class="form-control" required="" />
</div>
</div>
<br />
<div class="row">
<div class="col-md-7">
<label>Gender*
<span class="required-label" ng-show="form.$submitted || form.gender.$touched">
<span ng-show="form.gender.$error.required">(Gender is required.)</span>
</span>
</label>
<select name="gender" class="form-control" ng-model="insertProfile.gender" required >
<option value ="">Select Gender</option>
<option value = "M">Male</option>
<option value = "F">Female</option>
</select>
</div>
</div>
<br />
<div class="row">
<div class="col-md-7">
<label>Birth Date*
<span class="required-label" ng-show="form.$submitted || form.birth_date.$touched">
<span ng-show="form.birth_date.$error.required">(Birthdate is required.)</span>
</span>
</label>
<input type="date" name="birth_date" class="form-control" ng-model="insertProfile.birth_date" required />
</select>
</div>
</div>
</div>
</div>
<br />
<div class="row">
<div class="col-md-5">
<label>Mobile #</label>
<input type="number" name="mobile" value="" class="form-control" ng-model="insertProfile.mobile" />
</div>
<div class="col-md-5">
<label>Email*
<span class="required-label" ng-show="form.email.$error.email">(Invalid email address.)</span>
<span class="required-label" ng-show="form.$submitted || form.email.$touched">
<span ng-show="form.email.$error.required">(Email is required.)</span>
</span>
</label>
<input type="email" name="email" value="" class="form-control" ng-model="insertProfile.email" required />
</div>
</div>
<br />
<div class="row">
<div class="col-md-5">
<label>City</label>
<input type="text" name="city" value="" class="form-control" ng-model="insertProfile.city" />
</div>
<div class="col-md-5">
<label>Address</label>
<textarea name="address" class="form-control" rows="4" cols="50" ng-model="insertProfile.address" ></textarea>
</div>
</div>
</form>
</div>
</div>
我认为它不起作用,因为AngularJS使用ISO-8601格式验证类型日期,即yyyy-mm-dd。因此,使用yyyy/mm/dd输入日期将导致触发错误的无效格式。请阅读此处的AngularJS文档以了解更多信息。
相关文章:
- AngularJS$http.post没有'不适用于Chrome,仅适用于IE
- 如何调试遗留的javascript代码(适用于IE,但在Google Chrome中不正常)
- js不适用于Chrome,但适用于IE
- (PHP&JavaScript)a href添加按钮赢得'我不适用于Mozilla,但适用于IE和谷歌
- javascript代码适用于IE和Chrome,但不适用于Firefox
- html5 canvas 中的 OffsetX 适用于 IE、Safari、Chrome,但不适用于 Firefox
- .load() 适用于 IE 和 dreamweaver 预览版,但不能使用 opera 和 chrome
- IE 9 Javascript Window Variable 为 null.适用于IE 8
- Javascript / CSS不适用于IE 10,但适用于IE 8
- html 选择列表更改无法在谷歌浏览器上调用方法(适用于 IE)
- 此代码阻止我的表单提交(仅在 chrome 中,适用于 IE 和 Firefox)
- Jquery适用于IE以外的所有浏览器
- Fotorama - 适用于IE,Firefox,但不适用于Chrome(上传到服务器)
- JavaScript适用于IE,但不适用于Firefox和Chrome
- javascript 函数 - 传递给函数的变量适用于IE,但不适用于Firefox
- HTTPRequest to Node 服务器适用于 IE 8,但不适用于 IE 7
- Javascript window.print 适用于 IE 和 FF,但不适用于 Chrome(在旧版本中曾经如此)
- 两个几乎相等的jQuery函数;一个适用于IE,一个不适用于IE
- 寻找适用于IE的开发人员插件
- Firefox 中的 HTML 位置问题(适用于 IE 和 Chrome)