Pass input value as a parameter in API Call

Hi there!

I would like to build the following:

(1) User inputs a text in input bar
(2) User presses button
(3) API call is triggered from button press and the user input is sent as a parameter for the API call.

I know how to do (1) & (2) but for (3) I do not understand how to pass user input as a parameter for an API POST request. Any help is appreciated!

Thanks in advance!

Note: I want to do all (input and displaying API content) on the same page and do not want to direct to a new page upon button press.

Do you already have the API hooked up in your API Connector? If so, make sure you have Action selected instead of Data. Then you can reference the API on a Button is Clicked workflow. Also make sure the parameter that needs to be dynamic does not have the private box checked. this will allow you to dynamically enter the input’s value in that api call.

1 Like

Thanks for your response.

I already hooked up the API connector and it’s working for other API calls.
What I want to do is: Get user input >> press button >> send user input to API >> make calculation in the backend based on user input >> sent result back to front-end (Bubble) >> display results in text box in Bubble.
My problem is that if I use “Action” (instead of “Data”) I don’t know how I can put the API’s response into the text box as it doesn’t appear as an option under “Get external data from URL” (Which is does when I use “Data” not “Action”).

You cab create a custom state that holds the api response and set the data source to that custom state. Then in the Workflow when you run the api action you can set the state of that custom state in the next step.

Could you be more detailed about this? Like what kind of custom state and what to do exactly in the workflow?
Thanks a lot in advance!

If you see the “page element” (such as index) in the element tree, when you click on that to bring up its editor, in the upper right corner their is a little circle with an “i” in it. If you click that, it will open up for you to create custom states. These can be named anything you want and you also determine if it is a list or not, the type (text, number, api response, etc.), and the default value. In your case, name it whatever you want and make sure to find the type which will be named what you called the API in the API connector. Now in a workflow you can use the API as an Action (if you changed it to action in the connector) then on the next step you can “set state” of the page element and choose the state you created and set the value to “Result of step 1”. Now if the group you want to display is set to have a data source of that custom state then the data will show their every time the workflow runs.

1 Like

Thanks @williamtisdale this works now - greatly appreciate your help!

1 Like

yes make sure to turn private off to change para values.

Hey thanks for the advice but would it be possible for you to explain it in easier terms so that a noobie like me can make this possible. Thanks

Have you had any success? Which part specifically do you not understand?

Hi William, I’ve been trying to do this with a simple gpt response but I didnt understand exactly how to this. Is the exact same problem as the original topic.

So I have 3 elements
1 - Input text (user inserts text)
2 - Search button (Where it should be the “trigger” for the API to run)
3 - Text field for API output result (GPT Response)

So how do I set this? Many thanks.


This is where you change from data to action . Then also make your call dynamic. see where it says “use as”?