# How to access the button information in registered custom react component from Builder and pass the onclick callback of the button from builder?

**URL:** <https://forum.builder.io/t/how-to-access-the-button-information-in-registered-custom-react-component-from-builder-and-pass-the-onclick-callback-of-the-button-from-builder/1864>\
**Category:** Technical Questions\
**Created:** [March 4, 2022, 6:11pm UTC](https://forum.builder.io/t/how-to-access-the-button-information-in-registered-custom-react-component-from-builder-and-pass-the-onclick-callback-of-the-button-from-builder/1864 "2022-03-04T18:11:26Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![dharmaraju](https://avatars.discourse-cdn.com/v4/letter/d/6bbea6/32.png) [@dharmaraju](https://forum.builder.io/u/dharmaraju)\
**Post date:** [March 4, 2022, 6:11pm UTC](https://forum.builder.io/t/how-to-access-the-button-information-in-registered-custom-react-component-from-builder-and-pass-the-onclick-callback-of-the-button-from-builder/1864/1 "2022-03-04T18:11:26Z")

</div>

Have registered a custom react component (with a button inside it) from NextJS app into Builder. Now I want to access the button data(attributes) and pass an onclick callback from this component from App to Builder editor and use that button details inside that callback in the editor.

Thanks.

---

<div class="post-metadata">

**Author:** ![dharmaraju](https://avatars.discourse-cdn.com/v4/letter/d/6bbea6/32.png) [@dharmaraju](https://forum.builder.io/u/dharmaraju)\
**Post date:** [March 7, 2022, 2:05pm UTC](https://forum.builder.io/t/how-to-access-the-button-information-in-registered-custom-react-component-from-builder-and-pass-the-onclick-callback-of-the-button-from-builder/1864/2 "2022-03-07T14:05:59Z")

</div>

@builder\_support Any help here?

---

<div class="post-metadata">

**Author:** ![TimG](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/timg/32/714_2.png) [@TimG](https://forum.builder.io/u/TimG)\
**Post date:** [March 7, 2022, 6:45pm UTC](https://forum.builder.io/t/how-to-access-the-button-information-in-registered-custom-react-component-from-builder-and-pass-the-onclick-callback-of-the-button-from-builder/1864/3 "2022-03-07T18:45:53Z")

</div>

Hey @dharmaraju, depending on what you are looking to do there are a few options.

So it sounds like what you want is to just access a data attribute on the button within the component, correct? In that case, you could just add a click event within Builder to the custom component element that includes logic to check for the specific data attribute and then add it to state as needed. So if you added a [custom action](https://www.builder.io/c/docs/guides/state-and-actions) to the component within Builder, you could have something like:

```auto
if (event.target.dataset.whateverValue) {
  state.value = event.target.dataset.whateverValue;
}

```

![Screen Shot 2022-03-07 at 9.57.28 AM](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/d/d2af3a560648ee7b589bf91188e3e5935b8ced16.png)

Notice, you would want to use the ‘event’ object available to you in the Action’s custom code editor. Is that sufficient for what you are looking to do?

Let me know, and if not any further context would be helpful to figure out a better solution!

---

<div class="post-metadata">

**Author:** ![dharmaraju](https://avatars.discourse-cdn.com/v4/letter/d/6bbea6/32.png) [@dharmaraju](https://forum.builder.io/u/dharmaraju)\
**Post date:** [March 8, 2022, 6:54pm UTC](https://forum.builder.io/t/how-to-access-the-button-information-in-registered-custom-react-component-from-builder-and-pass-the-onclick-callback-of-the-button-from-builder/1864/4 "2022-03-08T18:54:10Z")

</div>

@TimG thanks for the answer. Actually we have a few custom react components (with buttons inside them) created in the NextJS codebase out of builder and registered in builder. Main thing is to do something in the onclick function of the button within the builder.

---

<div class="post-metadata">

**Author:** ![TimG](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/timg/32/714_2.png) [@TimG](https://forum.builder.io/u/TimG)\
**Post date:** [March 8, 2022, 10:56pm UTC](https://forum.builder.io/t/how-to-access-the-button-information-in-registered-custom-react-component-from-builder-and-pass-the-onclick-callback-of-the-button-from-builder/1864/5 "2022-03-08T22:56:35Z")

</div>

Hi @dharmaraju understood, I see you started another thread here:

> [@Passing callback functions while registering react components in builder](https://forum.builder.io/t/passing-callback-functions-while-registering-react-components-in-builder/1873/3):
>
> hey TimG and @dharmaraju - I was just working on integrating this in our NextJS codebase, maybe I can share how we are utilizing functions and React context. \<BuilderComponent model={Builder.previewingModel || 'builder-page'} context={{ callbackFn, }} /\> Then, in your custom component, you can access these via the builderState prop that is passed. function CustomComponent(props) { const onClick = () =\> { props.builderState.context.callbackFn(); } return ( \<butto…

Let me know if there is anything I missed otherwise we can continue the conversation there!