Support HTML5 autofocus attribute

[wmertens]

http://caniuse.com/#feat=autofocus tells the browser to focus an element on page load. It would be great if Angular had support for this built-in, so that it also works on browsers that don't support it and when creating elements dynamically, like in forms.

As an example, here's a directive that does this: https://gist.github.com/mlynch/dd407b93ed288d499778
Perhaps this can be used as-is, or it might need adapting for the case where many elements with the autofocus attribute get created at once (per the spec only one such element should exist per doc but hey).

[Narretz]

A previous topic about this was closed as "not core": #2012 (comment)

I agree with the reasoning, but I'll keep it open for further opinions.

[wmertens]

So autofocus is an HTML5 attribute whose expectation is broken by how Angular works. As it is a core attribute I would expect Angular core to handle it...

[Narretz]

In that sense, any website that uses JavaScript to insert page elements "breaks" the autofocus attribute.

[wmertens]

@Narretz sure, but Angular has the opportunity to fix it...

Declarative focus is so much nicer than imperative. It keeps the code clean, no having to access the DOM from controllers.

[vitaly-t]

I think that supporting attribute "autofocus" should be done in a better way in Angular, with binding.

It happens way too often that one needs to autofocus elements conditionally. For example, a default autofocus element can become disabled or invisible and you need to change autofocus accordingly.

The basic HTML5 support for it is just too primitive. Why not do it right from start and use the power of Angular to autofocus with support for optional one-way binding?

We need ng-autofocus={{boolean condition}}, to trigger focus change when a certain condition is met. When used with once-off binding, ng-autofocus={{::condition}}, it would be similar to autofocus attribute when the condition is true. And in general it would let us handle automatic focus change in response to changes within a form.

It would be used mostly through once-off binding, as this: ng-focus={{::condition}}.

[wmertens]

I'm not sure I agree, the autofocus attribute has the intent of specifying
focus when an element first appears, not later.

The stateful focus management you propose has already been decided as not
belonging into angular core... See e.g.
https://github.com/goodeggs/ng-focus-on
On Sat, Jan 24, 2015, 1:50 PM Vitaly Tomilov [email protected]
wrote:

I think that supporting attribute "autofocus" should be done in a better
way in Angular, with binding.

It happens way too often that one needs to autofocus elements
conditionally. For example, a default autofocus element can become disabled
or invisible and you need to change autofocus accordingly.

The basic HTML5 support for it is just too primitive. Why not do it right
from start and use the power of Angular to autofocus with support for
optional one-way binding?

—
Reply to this email directly or view it on GitHub
#10833 (comment)
.

[kevinlbatchelor]

+1

[34r7h]

+1

[csvan]

+1

[reda-alaoui]

+1

[9662]

+1

I would not have expected Angular to break HTML in such a basic and unnecessary way. 😒

[Narretz]

@9662 How exactly does angular break HTML? It's a spec problem if the autofocus attribute does not work with dynamically generated elements.

[wesleycho]

I agree with the reason to close the previous issue. It is very easy to create a directive on the user side to do autofocusing if one wants it.