How to parse API endpoint to a modal

Wappler General How To
#1

Hello, I wondered if anyone can give me some pointers here, please? I think I am close but have not had that eureka moment yet.

I am using sheety to convert a google sheet into a JSON api. This sheet has two tabs. One contains a list of courses (api endpoint /courses) and the other a list of training companies (api endpoint /trainer). The company name is unique.

I based my first page on your unsplash tutorial but in my case, I have the list of trainers, logos etc pulled in from the API in a repeat row. (screenshot 1).

sc1
sc1481×537 19 KB

In the card, I have a calendar button which opens a model. In this modal, I have linked the sheety API for the courses endpoint. Currently, this runs and displays all course data.

Screenshot 2020-03-24 at 11.04.31
Screenshot 2020-03-24 at 11.04.312244×1174 259 KB

What I want to do is only display the courses related to the trainer selected so if the card is Company ABC, the listing in the modal will only relate to them. I need some way of making the button pass the endpoint to the modal and use that, like
/trainingCalendar/courses?company=Company ABC

Of course, I may be missing the obvious on account of looking at it for too long…

Thanks and best regards,
Brian

#2

ok, I am a little closer. I’ve now added company in the query parameters and then added a variable to the page with a static company name value. When the modal opens now, it shows the filtered data based on the static value. The problem is how to make the variable value change pending on what button is pressed.

#3

If you’re just changing the company name, do you need to use a variable? Couldn’t you just send the value as an URL parameter? Eg if the API query params were:

image

… you could attach this to a button:
dmx-on:click="sc_currency.load({base: 'USD'})"

#4

Hello Tom,
Thank you for your reply. You’ve given me some more things to try.
Cheers,
Brian

#5

Hello Tom,
Looking at your screenshot, it looks like this is from the server connect side of things. I had been trying this out on the app connect side. I’ll try the other way to see if I have any success.

Cheers,
Brian