# Symbol - fetch data based on custom field

**URL:** <https://forum.builder.io/t/symbol-fetch-data-based-on-custom-field/271>\
**Category:** Technical Questions\
**Created:** [October 28, 2020, 4:10am UTC](https://forum.builder.io/t/symbol-fetch-data-based-on-custom-field/271 "2020-10-28T04:10:20Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![alex\_lindsay\_manime](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/alex_lindsay_manime/32/209_2.png) [@alex\_lindsay\_manime](https://forum.builder.io/u/alex_lindsay_manime)\
**Post date:** [October 28, 2020, 4:10am UTC](https://forum.builder.io/t/symbol-fetch-data-based-on-custom-field/271/1 "2020-10-28T04:10:20Z")

</div>

I am trying to build a symbol that will allow editors to add a product block to their blog content. To that end, I’d like for them to be able to add a productId to a designated custom field for the symbol. I would like to use the value of the field as a variable in a fetch call that I make in the custom JS for the symbol, then using that result set, bind the properties of various pieces of the symbol to the data in that result. For the life of me, I can’t find an example of how to refer to the value of a custom field within the custom JS. I’ve tried state.FIELD\_NAME and I’ve tried using the FIELD\_NAME directly but neither of those seems to work as expected.

const host = ‘https://\*\*\*\*\*\*\*\*\*\*.amazonaws.com/dev’;  
const nailProductId = state.nailProductId;  
console.log({nailProductId});  
fetch(`${host}/nailproducts/read?filter=nailProductId%20eq%20${nailProductId}`)  
.then(res =\> res.json())  
.then(data =\> {  
console.log({data});  
state.product = data[0];  
})

console.log({nailProductId}); is outputting {nailProductId: undefined}

And yes, I have a nailProduct with the nailProductId I have in the symbol by default.

UPDATE: if I hardcode a value in place of the reference to state.nailProductId, I get data in the console.log({data}) line

Please add to the FAQs how to reference a field from the current content item in the JS of another content item (or in the custom JS for the component/symbol/content item). I see how to reference part of the URL to customize a fetch for binding data, but not how to reference data from the component itself.

---

<div class="post-metadata">

**Author:** ![anon30523337](https://avatars.discourse-cdn.com/v4/letter/a/48db29/32.png) [@anon30523337](https://forum.builder.io/u/anon30523337)\
**Post date:** [October 28, 2020, 4:29pm UTC](https://forum.builder.io/t/symbol-fetch-data-based-on-custom-field/271/2 "2020-10-28T16:29:11Z")

</div>

Hello and thanks for posting! You should be able to access the input via `state.nailProductId` as long as the symbol has an input for that field. I would suggest adding an Input (via the data tab) that looks something like this:

 ![image](https://us1.discourse-cdn.com/flex020/uploads/builder/original/1X/37509c3554dc7714ce1a521d99defd09d9b48d53.png)

Then, when adding the symbol to a page or piece of content the end user can add enter a value on the Options tab:

 ![image](https://us1.discourse-cdn.com/flex020/uploads/builder/original/1X/90be1f1c156d3f0dbc65d06a5535789883772c23.png)

---

<div class="post-metadata">

**Author:** ![alex\_lindsay\_manime](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/alex_lindsay_manime/32/209_2.png) [@alex\_lindsay\_manime](https://forum.builder.io/u/alex_lindsay_manime)\
**Post date:** [October 28, 2020, 4:48pm UTC](https://forum.builder.io/t/symbol-fetch-data-based-on-custom-field/271/3 "2020-10-28T16:48:40Z")

</div>

I do have an input on the symbol and the a value has been added on the Options tab.

> **[Builder: Drag and drop page building for any site](https://builder.io/content/5ff2a55a8ad64ecdad71fc2c22e485d7)**
>
> Builder is the first and only headless CMS with full visual drag and drop editing

  
and  

> **[Builder: Drag and drop page building for any site](https://builder.io/content/6aed4ae6c210452c857f06680982058c)**
>
> Builder is the first and only headless CMS with full visual drag and drop editing

---

<div class="post-metadata">

**Author:** ![anon30523337](https://avatars.discourse-cdn.com/v4/letter/a/48db29/32.png) [@anon30523337](https://forum.builder.io/u/anon30523337)\
**Post date:** [October 28, 2020, 9:10pm UTC](https://forum.builder.io/t/symbol-fetch-data-based-on-custom-field/271/4 "2020-10-28T21:10:19Z")

</div>

It looks like the input is called `productId` instead of `nailProductId`, I updated the assignment here and it looks to be working:

```auto
const nailProductId = state.productId;

```

---

<div class="post-metadata">

**Author:** ![alex\_lindsay\_manime](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/alex_lindsay_manime/32/209_2.png) [@alex\_lindsay\_manime](https://forum.builder.io/u/alex_lindsay_manime)\
**Post date:** [October 28, 2020, 9:12pm UTC](https://forum.builder.io/t/symbol-fetch-data-based-on-custom-field/271/5 "2020-10-28T21:12:43Z")

</div>

🤦‍♂️

Thanks 🙂

What happens when you code not having had enough to drink.

---

<div class="post-metadata">

**Author:** ![anon30523337](https://avatars.discourse-cdn.com/v4/letter/a/48db29/32.png) [@anon30523337](https://forum.builder.io/u/anon30523337)\
**Post date:** [October 28, 2020, 9:29pm UTC](https://forum.builder.io/t/symbol-fetch-data-based-on-custom-field/271/6 "2020-10-28T21:29:04Z")

</div>

No worries, glad you got it working and nice to see you taking advantage of some of our advanced features!
