Build a Form (with submit) to call API Data

Hi all

I have correctly connected to an API that we can ‘search’ for data. E.g. a list of articles matching a search query.

What I can’t figure out is how to correctly build a form and/or the API connection to allow me to search the API based on the form inputs.

If anyone can assist, please advise.

Matt

2 Likes

You mean for example set a parameter to reduce results from API using an input field?
Normally you just need to set parameter in your API Data connection (example ?filter=[filter])
and when you will set the data display, just set the url parameter filtre to input field value.

Hi, thanks for the quick reply!

So the DB we connect to is massive, so we need to refine the results we receive in JSON from the API by using a form with various form fields.

For example, we might search for an article with these form fields: Industry, Location, Keywords and then a submit button.

In the API Connector, I can input in the body parameters: articleType and the value as [“the industry”] - but I’m not sure how to setup the API connection so that “the industry” is dynamic and created by the input in the matching form field.

When I connect to say the iTunes or Giphy example, they have a ‘search input’ field in the API connection, but all I can seem to manage is to choose the API i’ve setup, and not provide any variable fields (e.g. those 3) that can be changed by the input in the form.

Can you show screenshot of your setting on both API Connector and Where you display data (use Get data from API, don’t forget to click on it to see parameters)

This is the api connector settings (removed Key Value for security)

And here is the display data from external API. When I click on pre-made api plugins (e.g. iTunes) they have fields that display, e.g. Search Input. So I must be doing something wrong on the API connector end as even though I’m adding parameters I don’t get any fields I can use to input the data. This shows JSON in the body type, I believe form-data is what I need to use, and have tested with form-data with no luck.

Remove all private checkbox in api connector. This is why you dont see them in get api data

Thank you! This got me one step closer, much appreciated.

I have a follow up question, if the parameter requirement for example is [“Input Industry Here”]

In the parameter in the API Call, I can pre-fill that as [“Mining”] for example, but how do I write the parameter to enable me to change the variable “input industry here”. If I leave that field blank I get an error, if I add the variable then it is ‘pre-filled’ and can’t be changed. If you can guide me here I think I can handle it from here on.

26%20am

Would you say this is correct or incorrect?

And naturally I’d like to set this up to only query on button click

This depend of what you need to set. You have to look into API doc. If you have the link to doc I can tell you.

Thank you: https://developer.contentstudio.io/

Your setting may not work. I will try to set an example later. You need to follow how the json structure is.

Ok, thank you - any help is really appreciated.

Here’s how I think you should set this:

2 Likes