Validation Issue in IE 11 when same ng-model in multiple form set to required

zhanke

The application I am working on has multiple tabs, each tab contains a form with ng-submit. And they share some common fields for example: selectedService.

It's been set to required in both forms. However updating it in one form then switch to another form, Chrome wouldn't complaint it's required since it already has value, however IE 11 complaints that it's required although it already has data entered and angular indicates that it's valid as well.

Is there anyway that I can update IE to let it know that this model has been updated and it has value? Or it's the form needs re-validation?

---------------------Update--------------

I am finally able to replicate it: http://plnkr.co/edit/Gjphya?p=preview So if you select a value in the first dropdown and click submit in the second row, it says it's required. This only happens in IE, not in Chrome or other browsers.

And I think the problem is around this line:

 $scope.selectedService = null;

Thanks!

zhanke

All I need to fix is to add this line in the select tag:

<option value="">Please Select...</option>

If I init the ng-model in controller, it also fix the issue, however sometimes it causes unexpected issue if the dropdown is binded to an array instead of object collection.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

Angular Form Validation: $error.required set even when ng-required=false with custom input directive

Angular 4 form validation: setting ng-dirty does not work in IE 11

Angular Form - "Required" with ng-model-options

Multiple form binding with the same reactive form control using *ngFor validation issue

angular form validation - set required by code (not working)

Angular Form Validation using Ng Model

Passing form data to a model when using multiple models in the same view

Jquery form validation issue when submitting form

Django Crispy form set model field as required

Redux-form validation breaks when using multiple components with the same form name

Vue + Vuetify Validation issue when clearing form

Form model validation atleast 1 field is required in Yii REST Update

Laravel required if validation issue

Multiple validation to same field in react final form

AngularJS directive not updating ng-model on textarea in IE 11

Set a radio box as a required entry with the built-in Magento form validation

How to dynamically set a required rule to the Form.Item validation

form validation ''required' is not working

Why Angular 1 form validation not works without ng-model

Angular 1.3 form validation with deep objects as ng-model

HTML "required" attribute for multiple button with multiple text field on same form

Bootstrap Form Validation Highlighting Label Text in Green When Input is Not Required?

Form Validation Error when a required field is remained blank in django

JavaScript form validation issue: Alert for same answers for MOST and LEAST

IE 11 Ajax issue

Footer Issue in IE 11

How to set ng-model variable from custom validation directive

symfony3 same validation for model and admin form

Validation: how to set a field that is not required to 'null' when input is empty