★ wanayoo — archive 1999 https://github.com/angular/angular.js/issues/16830Nouvelle recherche | Portail wanayoo
Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

md-select not working properly with Angular 1.7.7 #16830

Closed
2 tasks
Mike-Bauer opened this issue Feb 8, 2019 · 8 comments · Fixed by #16836, angular-indonesia/angular.js#184 or javascript-indonesias/angular.js#138
Closed
2 tasks

md-select not working properly with Angular 1.7.7 #16830

Mike-Bauer opened this issue Feb 8, 2019 · 8 comments · Fixed by #16836, angular-indonesia/angular.js#184 or javascript-indonesias/angular.js#138
Assignees
@Narretz
Labels
component: forms severity: regression
Milestone
1.7.x

Comments

@Mike-Bauer
Copy link

@Mike-Bauer Mike-Bauer commented Feb 8, 2019 •
edited

I'm submitting a ...

  • [x ] bug report
  • feature request
  • other

Current behavior:

Angular 1.7.7 results in a problem for the Angular Material md-select directive when the directive has the required attribute, has a parent with an ng-if, and the md-select's ng-model is given an initial value. The directive incorrectly flags a required error and the displayed select option shows a trailing asterisk.

Expected / new behavior:

The md-select should not flag a required error and the displayed selected option should not show an asterisk.

Minimal reproduction of the problem with instructions:

In Controller:

$scope.selectModel = 'option1';
$scope.showSelect = true;

In View:

<md-input-container ng-if='showSelect'>
  <label> Select </label>
  <md-select ng-model='selectModel' required>
    <md-option value='option1'> Option 1 </md-option>
    <md-option value='option2'> Option 2 </md-option>
  </md-select>
</md-input-container>

AngularJS version: 1.7.7

AngularJS Material version: 1.1.12

Browser: Chrome 71.0.3578.98 | Firefox 64.0.2 | Edge 42.17134.1.0

Anything else:

screen shot 02-08-19 at 02 27 pm

screen shot 02-08-19 at 02 27 pm 001
@Narretz
Copy link
Contributor

@Narretz Narretz commented Feb 9, 2019

It works for me:
http://plnkr.co/edit/dP3Y4oTsbQoQ44tfqj7x?p=preview

Please provide a runnable demo, code and screenshots alone are not enough.
The example code is also incorrect: the label element is not closed.

@jmkrimm
Copy link

@jmkrimm jmkrimm commented Feb 11, 2019

The issue appears when you add an ng-if to the md-input-container.

@Mike-Bauer
Copy link
Author

@Mike-Bauer Mike-Bauer commented Feb 11, 2019

Correct, the issue does appear when you add an ng-if to the md-input-container or to a parent div as shown in this example.

http://plnkr.co/edit/71Gc7SshCFraulg5tbpx?p=preview

@Narretz Narretz added this to the 1.7.x milestone Feb 13, 2019
@Narretz Narretz self-assigned this Feb 13, 2019
@Splaktar
Copy link
Member

@Splaktar Splaktar commented Feb 13, 2019

Just in case it wasn't clear, this works fine with AngularJS 1.7.6 (demo).

This appears to have been caused by 005dd97.

@kambleaa007
Copy link
Contributor

@kambleaa007 kambleaa007 commented Feb 18, 2019 •
edited

works in older version 1.7.6 causing problem in version 1.7.7
any updates on #005dd97 https://github.com/angular/angular.js/commit/005dd97255840547f0c11f4cd0ee9ec126ad1325

@Narretz
Copy link
Contributor

@Narretz Narretz commented Feb 19, 2019

I'm working on a fix but in the mean time using NG-required=“true“ instead of plain required should work.

@jmkrimm
Copy link

@jmkrimm jmkrimm commented Feb 19, 2019

Oddly enough using required="true" also works.

Narretz added a commit to Narretz/angular.js that referenced this issue Feb 20, 2019
fix(required): correctly validate when required on non-input element …
9be1198 
…is surrounded by ngIf

Closes angular#16830
@Narretz Narretz mentioned this issue Feb 20, 2019
Merged
3 tasks
@Narretz
Copy link
Contributor

@Narretz Narretz commented Feb 21, 2019

Yes, that is because we considered the value of the required attribute for the requirement status. However the presence of required already means that the control is required.

Narretz added a commit that referenced this issue Mar 6, 2019
@Narretz
fix(required): correctly validate required on non-input element surro…
6959bc2 
…unded by ngIf

Closes #16830
Closes #16836
Narretz added a commit that referenced this issue Mar 6, 2019
@Narretz @Narretz
fix(required): correctly validate required on non-input element surro…
a4c7bdc 
…unded by ngIf

Closes #16830
Closes #16836
@GulajavaMinistudio GulajavaMinistudio mentioned this issue Mar 7, 2019
Merged
3 tasks
@GulajavaMinistudio GulajavaMinistudio mentioned this issue Mar 9, 2019
Merged
3 tasks
Kiku-Reise pushed a commit to Kiku-Reise/angular.js that referenced this issue Apr 6, 2019
@Narretz @Kiku-Reise
fix(required): correctly validate required on non-input element surro…
8404f87 
…unded by ngIf

Closes angular#16830
Closes angular#16836
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@Narretz Narretz

Labels
component: forms severity: regression
Projects
None yet
Milestone
1.7.x
5 participants
@Narretz @Splaktar @jmkrimm @Mike-Bauer @kambleaa007