ember-modal-dialog icon indicating copy to clipboard operation
ember-modal-dialog copied to clipboard

Feature: configuration option to set focus when dialog opens

Open kagemusha opened this issue 10 years ago • 8 comments

for modals with input fields, seems natural to set focus to the first one when it opens. I propose a configuration option such as:

{{#modal-dialog
    ...
    focusSelector='#some-input-field'
}}

If you think this useful, I can submit a PR

kagemusha avatar Aug 09 '15 22:08 kagemusha

I think you can subclass the modal dialog and solve it using the didInsertElement hook.

If something like this would be added (I'm not advocating it should be), I think it would be better to query the modal dialog DOM for the first element with an autofocus [html] attribute and focus it. Less boilerplate code, aligns well with existing HTML behaviour.

sandstrom avatar Aug 18 '15 15:08 sandstrom

@sandstrom yes not too difficult to do, but idea is to save that bit of work

kagemusha avatar Aug 18 '15 16:08 kagemusha

This would be a nice addition.

jrowlingson avatar Aug 20 '15 20:08 jrowlingson

Just got a request for this from a client -anyone open to me adding it?

toranb avatar Sep 18 '15 14:09 toranb

For now I just sub classed it but let me know if you land that PR boss :)

toranb avatar Sep 18 '15 14:09 toranb

@toranb Definitely. I think it's a very common use case. Implementing this will also help with key responders that require focus as well (e.g. ESC to close modal).

We may (or may not) need different strategies for modal-dialog (uses ember-wormhole) and tether-dialog (uses ember-tether). Feel free to drop me a line in the Ember JS Slack if anything overly unexpected presents itself.

chrislopresto avatar Sep 18 '15 15:09 chrislopresto

I don't know that you can use didInsertElement. I've just been running into an issue on my own modal, and this only works the first time the modal is inserted, not any subsequent times. I've been trying to figure out how Discourse does it and hoping I don't have to rewrite all my modal components.

jdhines avatar Feb 25 '16 11:02 jdhines

+1 for this feature

coreypmurphy avatar Jan 17 '17 22:01 coreypmurphy