# How to use focus event?

**URL:** <https://discuss.hotwired.dev/t/how-to-use-focus-event/798>\
**Category:** General\
**Created:** [May 15, 2019, 2:06pm UTC](https://discuss.hotwired.dev/t/how-to-use-focus-event/798 "2019-05-15T14:06:59Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![atilla](https://yyz1.discourse-cdn.com/flex027/user_avatar/discuss.hotwired.dev/atilla/32/545_2.png) [@atilla](https://discuss.hotwired.dev/u/atilla)\
**Post date:** [May 15, 2019, 2:06pm UTC](https://discuss.hotwired.dev/t/how-to-use-focus-event/798/1 "2019-05-15T14:06:59Z")

</div>

I would like trigger an action when a text field is active.

It works using **click** event with the mouse.

But with **tab** key it is not working.

```
name() {
  console.log('selected field => name')
}

<div data-action="focus->user#name click->user#name">
  <%= form.label :name %>
  <%= form.text_field :name, autofocus: true %>
</div>

```

What is the correct way to use focus in a rails form?

---

<div class="post-metadata">

**Author:** ![javan](https://yyz1.discourse-cdn.com/flex027/user_avatar/discuss.hotwired.dev/javan/32/594_2.png) [@javan](https://discuss.hotwired.dev/u/javan)\
**Post date:** [May 15, 2019, 3:59pm UTC](https://discuss.hotwired.dev/t/how-to-use-focus-event/798/2 "2019-05-15T15:59:15Z")

</div>

The `focus` event doesn’t bubble so it can’t be handled on a parent element. You could:

- Move the `focus->user#name` action to the text field
- Switch to handling [`focusin`](https://developer.mozilla.org/en-US/docs/Web/API/Element/focusin_event) instead

> The `focusin` event fires when an element is about to receive focus. The main difference between this event and [`focus`](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event) is that `focusin` bubbles while `focus` does not.

---

<div class="post-metadata">

**Author:** ![atilla](https://yyz1.discourse-cdn.com/flex027/user_avatar/discuss.hotwired.dev/atilla/32/545_2.png) [@atilla](https://discuss.hotwired.dev/u/atilla)\
**Post date:** [May 15, 2019, 4:05pm UTC](https://discuss.hotwired.dev/t/how-to-use-focus-event/798/3 "2019-05-15T16:05:04Z")

</div>

`focusin` worked just perfect

thank you
