Citiestable shown in the tutorial. This column, called Bookmarks, will store the device ID of all the users that choose to bookmark a particular city.
Citiestable on Xano, and click on the
+sign to add a new column.
Textand call it "bookmarks".
listin the Structure dropdown, and make sure Required has the
Saveto add this field to the table.
PATCHrequest, containing a new device ID for one of the cities. This second endpoint will be the one targeted by the remote action we'll later add in Bravo.
GETCities by device
GETrequest, with the device ID passed as a query string parameter (we'll show later how the URL should be constructed).
Add API endpointon the top right of the dashboard.
CRUD Database Operations, then the
GET request, and put citiesByDevice as the name.
Save. This will automatically create an endpoint that will accept the GET request.
1. Inputssection, we'll click on the
+sign at the top right. Select
Citiestable and return only the cities that contain the device ID provided by the user.
Query all Recordsitem
Filtertab, add a filter by custom query by clicking on the pencil icon, and set the parameters as shown in the image below.
Save. Now, our citiesByDevice endpoint is ready!
Run & Debugat the top of the dashboard. If you introduce a
deviceIdparameter already present in the bookmarks field of any of the cities, the data for these cities will be returned in the API response. If none of the cities contains this device ID, the response will be empty.
Add API endpoint>
CRUD Database Operations> select the
EDIToperation > change the verb to
cities_id(already created for us)
device_id(we'll need to add this one, setting it as
Visible to the APItoggle switch.
Function stackto be able to add the device ID to the bookmarks field of the corresponding city. Remember that this field is a list of text elements, which correspond to the device IDs.
+icon on the top right to add a stack item.
Database Requests, select
Get Record(we only want to retrieve a single row from the table), and choose
cities_idinput as ID. For that, configure the
Inputspanel as shown below.
Outputpanel. We are only interested in returning the bookmarks list from the table item, as we'll later add to this array the device ID input, and store it again in the table.
Customizethe response as shown below.
bookmarks_array. (remember to click
cities_idprovided in the PATCH request). This was stored in a variable called
bookmarks_array(see screenshot above). This variable is an object containing the bookmarks list.
+icon on the top right of the
Function stack, then choosing
Data Manipulation, and then
bookmarks_array.bookmarksas the value of the variable, and
bookmarksas the name (see screenshot below). Hit
Data Manipulationoperation, then select
Arrays, and finally
Has Any Element.
bookmarksin the array dropdown (the name we defined in step 2️⃣ for the list).
device_idto the left of it, and
$thisto the right. This will check whether any of the array elements is equal to the device_id variable, and return a boolean variable:
trueif an element matches the device_id,
Saveafter specifying this expression, set
in_arrayas the variable name (this will be the boolean variable mentioned above), and click
Saveagain to close the panel.
Data Manipulation, and then
Else. The first path will be taken if the
in_arrayvariable is false (which means the device_id has not been found in the bookmarks list). If this is the case, we'll want to add the new device_id to the bookmarks list, and update the table record. Otherwise, the
Elsepath will be taken. In this case, as the device ID is already present in the bookmarks list, we won't perform any further operations, else than returning an empty body in the HTTP response.
Then, add a new function:
Add To End of Array
bookmarksas existing variable (we defined this one in step 2️⃣)
device_idas value. This will add the device_id to the end of the bookmarks array.
bookmarksfield in the table with the bookmarks array we created (containing the newly added device_id), for the row with
Array: Add to endfunction we just created, add a new function:
Find Cities record by field, set
id(name of the table field) next to field_name, and
cities_id(input value received with the HTTP request) next to field_value. As you can imagine, this will specify which record of the table will be edited.
bookmarksfield of the table equal to the
bookmarkslist variable containing the new device_id item (see screenshot below). Make sure all the other items are invisible. This will prevent errors later on.
Outputtab to decide what will be the content of the HTTP response returned after calling this endpoint. We chose to return all the fields of the updated table record. We set the name
resultto this variable (it will be needed later).
elsepath. In this case, as mentioned before, we'll just do "nothing", and return an empty body that will be sent in the HTTP response.
result. It needs to have the same name as the variable returned when editing the table record in the previous step. Finally, set its value to
resultvariable defined both in 4️⃣.1️⃣ and 4️⃣.2️⃣. Click on the item inside the response area, and set it to the
resultvariable as shown below.
GETGet cities by device
Sendto get a response. After doing this, make sure the following data is selected:
device.idto the Xano endpoint and add the bookmark.
Bodytab and add the following JSON.
Sendto test the request. As we won't need to bind the response data, it's not necessary to modify the Received Data or Selected Data tabs.
Get Single Cityrequest
.data.idpath is selected, along with all the other necessary data for the City Detail screen.
city_idas shown below. Notice that this is the same name we specified for the URL query string variable in the Add Bookmark request. This way, Bravo will know how to "connect" the Get Single City and Add Bookmark requests, so the bookmark is added to the city where the user triggered the remote action.
PATCHAdd Bookmark request as shown below. Configure the success and error response actions. In our example, we added an alert message for both.