I am making an API call under the API calls tab, and I want to use the data from this call in the elements tab. More specifically the initialize function. What syntax do I use to achieve this? The function only has two parameters instance and context neither of which show in the documentation that they have the capability of doing this. Is there another way?
If I understand correctly, the keys property of the context object might be part of what you’re after…
Unfortunately this does not yield the result im, looking for.
for example, if i were to write something such as
console.log(context.keys.my_key_name);
this logs “undefined” in the console, im not sure if im calling it correctly
IIRC, if the key is private, it might not be available client-side.
1 Like
This is what im working with,
does anything look wrong here? The Keys are public, i know the URL key looks weird but I am sort of doing a weird implementation of something here, so excuse the awkwardness
Tell us more, what you are trying to achive
I am creating a custom element, the only thing this element is trying to do, is add html tags to JSON data that has text in it. it is coming from an api call from a website called contentful, which is used to provide elements to websites.
Rich text is being sent from Contentful to bubble, but because bubbles API connector does not properly retain the texts original rich text formatting, I needed to create a custom plugin which formats the text coming from this API call, and adds HTML tags to it. There are a few obstacles I need to get through though.
-
To properly access the correct text in this JSON formatted API call, I need the name of the original rich text box created in contentful. Contentfuls api does not provide this information when you call it, so my plan is to manually enter it as a key. Here is an example of the data so you can see what I am talking about
let contentfuldata2 =’{\n’ +
’ “sys”: {\n’ +
’ “space”: {\n’ +
’ “sys”: {\n’ +
’ “type”: “Link”,\n’ +
’ “linkType”: “Space”,\n’ +
’ “id”: “tikpwskye7s8”\n’ +
’ }\n’ +
’ },\n’ +
’ “id”: “Y4rhZfxAQZPG6GHAV0Ekw”,\n’ +
’ “type”: “Entry”,\n’ +
’ “createdAt”: “2020-05-04T23:48:30.571Z”,\n’ +
’ “updatedAt”: “2020-05-13T00:26:31.723Z”,\n’ +
’ “environment”: {\n’ +
’ “sys”: {\n’ +
’ “id”: “master”,\n’ +
’ “type”: “Link”,\n’ +
’ “linkType”: “Environment”\n’ +
’ }\n’ +
’ },\n’ +
’ “revision”: 39,\n’ +
’ “contentType”: {\n’ +
’ “sys”: {\n’ +
’ “type”: “Link”,\n’ +
’ “linkType”: “ContentType”,\n’ +
’ “id”: “pepsi”\n’ +
’ }\n’ +
’ },\n’ +
’ “locale”: “en-US”\n’ +
’ },\n’ +
’ “fields”: {\n’ +
’ “DYNAMIC”: “THIS_NAME_IS_DYNAMIC”,\n’ +
’ “ALSO_DYNAMIC”: {\n’ +
for example if I want to access data through this object id have to do something like
sys.space.etc.etc.fields.DYNAMIC_VALUE.DYNAMIC_AGAIN
- I need a separate API call for every rich text box element defined in contentful, so I need to use the API tab in the plugin builder so I can add as many as id like
I just need these two values to be passed over to the elements tab where the code takes the values, grabs the data from contentful, adds tags and displays it using instance.canvas etc
I know that was a lot, so ask for clarification, I am also a learning developer not out of school yet
You’re close. The proper syntax to access keys that the User inputs via the Plugins tab is actually:
context.keys['KEY_NAME_GOES_HERE']
2 Likes
This is great, but where is the documentation for the syntax? I can’t find it anywhere
2 Likes
Hey Jonah, Nice to see people are still arriving at this thread and finding answers.
I am with you on this one that it’s definitely not clear within bubbles docs (Me from two years ago definitely remembers this being frustrating)
There’s also something to be said that when they mention that keys is an object without mentioning if we are using bracket object notation, or accessing an array, that it’s very ambiguous. The docs probably need to be more verbose and the amount of views the thread has is definitely showing there’s a need for better documentation. Bubble is aiming at a lower code market, which should lend itself to verbose documentation anyway. But that’s just my opinion.
2 Likes