# How to access $(this) with api.attachWidgetAction?

**URL:** https://meta.discourse.org/t/how-to-access-this-with-api-attachwidgetaction/43570
**Category:** Development
**Created:** [May 2, 2016, 8:34pm UTC](https://meta.discourse.org/t/how-to-access-this-with-api-attachwidgetaction/43570 "2016-05-02T20:34:56Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![stevenpslade](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stevenpslade/32/53550_2.png) [@stevenpslade](https://meta.discourse.org/u/stevenpslade)
#### Post date: [May 2, 2016, 8:34pm UTC](https://meta.discourse.org/t/how-to-access-this-with-api-attachwidgetaction/43570/1 "2016-05-02T20:34:56Z")

</div>

I am adding a new post menu button with `api.addPostMenuButton`.

I would like to access the data of this post-menu button on click using `api.attachWidgetAction`.

Ideally, it would be the equivalent of:

`$(this).attr('data-something')`

Any ideas?

---

<div class="post-metadata">

### Author: ![eviltrout](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviltrout/32/5275_2.png) [@eviltrout](https://meta.discourse.org/u/eviltrout)
#### Post date: [May 3, 2016, 3:09pm UTC](https://meta.discourse.org/t/how-to-access-this-with-api-attachwidgetaction/43570/2 "2016-05-03T15:09:51Z")

</div>

You can’t access selectors like that when using the widget code (with a couple of exceptions).

The reason is the widgets can be re-rendered at any time and replaced with new HTML. So even if you added an attribute from some other process it would likely be painted over when it refreshed.

On the other hand, if you were able to create that `data-*` attribute as part of a decorator, you should already have it in `attrs` and you can access that in your action as `this.attrs`.

---

<div class="post-metadata">

### Author: ![stevenpslade](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stevenpslade/32/53550_2.png) [@stevenpslade](https://meta.discourse.org/u/stevenpslade)
#### Post date: [May 3, 2016, 4:18pm UTC](https://meta.discourse.org/t/how-to-access-this-with-api-attachwidgetaction/43570/3 "2016-05-03T16:18:37Z")

</div>

Thanks for the explanation. Very helpful. 🙆‍♀️

Does `api.attachWidgetAction` have access to `attrs` (my guess is no since I tried with no luck). If no, how exactly would a post menu button action have access. Here’s an example of what I mean:

```
api.addPostMenuButton('drink-coffee', (attrs) => {
        return {
          action: 'drink-coffee',
          icon: 'coffee',
          className: 'drink-coffee',
          title: 'Coffee',
          data: {
            'coffee-link': attrs.shareUrl
          },
          position: 'first'
        };
      });

```

So here we want the action `drink-coffee` to link to the `data-coffee-link` as defined in the `addPostMenuButton`. Since `attachWidgetAction` does not have access to `attrs` (assumingly), where would we put some good ol’ JS to link to the `data-coffee-link`.

Apologies for basically asking for a tutorial 🙇‍♂️

---

<div class="post-metadata">

### Author: ![eviltrout](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviltrout/32/5275_2.png) [@eviltrout](https://meta.discourse.org/u/eviltrout)
#### Post date: [May 3, 2016, 4:31pm UTC](https://meta.discourse.org/t/how-to-access-this-with-api-attachwidgetaction/43570/4 "2016-05-03T16:31:21Z")

</div>

Yes you can use `this.attrs` to access the attributes within your action. If it’s not working, make sure you’re not using the ES2015 fat arrow function syntax, as it preserves `this` from the outer scope, which is _NOT_ what you want in this case.

For example:

```javascript
api.attachWidgetAction('post', 'annoyMe', function() {
   // this.attrs is the attrs
});

```
