CODEWITHSUNDEEP
javascripthtmlangularjsdialogmaterial-design
yammerade
yammerade

Reputation: 629

Angular-Material md-select in md-dialog

I have an angular material app in which I have a button that triggers a dialog box with a dropdown in it. If the button is at the top, everything works fine and as expected.

If the button is towards the bottom so the user has to scroll to get to it, however, once the dropdown is hit, the page jumps back to the top. The dialog box stays open at the bottom and I can't scroll down to it or click out of it, so I have to reload the page to do anything and the dialog box is useless.

If I use

<select ng-options="opt.val as opt.name for opt in options" ng-model="d"></select>

then it works fine.

But if I use a md-select

<md-select ng-model="d">
    <md-option ng-value="opt.val" ng-repeat="opt in options">{{opt.name}}</md-option>
</md-select>

then it breaks.

jsfiddle: https://jsfiddle.net/st3m3x0g/3/

If you scroll all the way to the bottom of the output, click a button, then try to open the dropdown, you can see the issue.

Is there any way to avoid this?

Upvotes: 4

Views: 6694

Answers (2)

bondili siva singh
bondili siva singh

Reputation: 41

This functionality not working in angular material v0.9.8, actually i need a functionality on a dialog box when i click outside the box it should hide in v 0.9.8 of angular material.

Upvotes: 2

user300285
user300285

Reputation:

This has been fixed in v0.9.0

See issue 1648 for further details.

Upvotes: 1

Related Questions