$mdDialog doesn't play well with forms

[wmertens]

See http://jsfiddle.net/p02Ls1dh/3/

mdDialog would be perfect for a quick entry panel, but it sets focus on the last button by default and if you try to use <form> for handling submit it breaks.

So maybe $mdDialog should:

• support a .md-dialog-focus class to set the focus
• bind the enter key for the .dialog-close button
  • shouldn't that be .md-dialog-close?

    material/src/components/dialog/dialog.js

    Line 373 in 01bbc4c

    var closeButton = element[0].querySelector('.dialog-close');

PS: I needed to put type=button on the cancel md-button so the form wouldn't click Cancel but Submit when typing <Enter>. Is that a bug with md-button or is that expected?

[marcysutton]

Focus is set in the modal for accessibility purposes, but it does make sense to make the focusable element configurable. Maybe people want to send focus to a heading with tabIndex="-1" or some other element.

submit is the default type of button, so having to include type="button" to not submit a form is expected. https://developer.mozilla.org/ru/docs/Web/HTML/Element/button (Also, space bar is the expected key when working with buttons.)

[wmertens]

Alright, supporting tabIndex="-1" sounds good to me, or maybe even the element with the lowest tabIndex.

As for the key, I meant using the Enter key while the focus is elsewhere in the dialog. It would obviate the need of a <form> tag. The Esc key is already captured, so Enter would be nice too. Right now it only works because the close button is getting focus on show.

[wmertens]

I thought about this some more and I think it would be great if angular could facilitate the HTML5 http://caniuse.com/#feat=autofocus attribute.
This means that on element create, it sets focus on that element, and directives like $mdDialog should not steal focus if there's an element with autofocus set.

The directive is very simple: https://gist.github.com/mlynch/dd407b93ed288d499778 - should this be part of Angular proper? That leaves just the not-stealing-focus in $mdDialog.

[wmertens]

I just created angular/angular#455 for the support in Angular proper.

[gustavohenke]

Beware that angular/angular is Angular 2.0 ;)

[wmertens]

@gustavohenke argh thanks, I was wondering why there was no other issue mentioning it 😅. angular/angular.js#10833 is the new one.