Setting endpoint body dynamically

💬 App Building
1

Hello,

I'm working on setting up the body for a POST request to my "create row" endpoint. However, I'm encountering some difficulty in dynamically constructing the body. While I understand that the body can be set in the "Body" section of the query, my table has multiple columns, and only a subset of them is required to save the data via the endpoint.

I'm trying to set the body when triggering the endpoint using JavaScript. It seems like what I need is the additionalScope property, but when I run the following code, the body of the endpoint request ends up empty:

await newRow.trigger({
additionalScope: {
title: "new title",
subtitle: "subtitle"
}
})

Is there any insight how can I accomplish this?

I want to do this dynamically for example, one of these calls could have a title, subtitle and a new row could have another column item type

2

Hi @oriyu and welcome to the forum!

My recommendation would be to create a javascript query which you can use to create the body of your API post, and then refer to the result of that JS query in your API body, e.g. {{ query1.data}}

This allows you to create all sort of logics and dynamically push/delete values/object from your main body, based on your logic.

This js query can then be triggered from almost anywhere in the app, and then the js query triggers your API query.

Hope this makes sense, let me know if you need guidance with your JS query.

1 Like
3

Thank you, I idea of the JS query makes sense, do you have an example ofr reference referring the result of the JS query. That is the part i'm having difficult with. Thanks!

4

Hey @oriyu,

So let me give you an example I'm currently working on, let's call it query1:

const addCustomerAddress = SL_adressToggle.value;

const tracker = {
  id: query2.data,
  recipient: {
    name: SL_recipientName.value,
    ...(SL_nrc.value && { nrc: SL_nrc.value }),
    ...(SL_nrc.value && { economic_activity: SL_economicActivity.value }),
    ...(addCustomerAddress && {
      address: {
        department: SL_recipientDepartment.value,
        municipality: SL_recipientMunicipality.value,
        complement: SL_recipientAddress.value,
      },
    }),
    ...(SL_idType.value && {
      identificationDocument: {
        type: SL_idType.value,
        number: SL_idNumber.value,
      },
    }),
  },
  items: SL_itemList.instanceValues.map(x => ({
    description: x.SL_itemDescription,
    type: x.SL_itemType,
    quantity: x.SL_itemQuantity,
    unitPrice: x.SL_itemPrice,
    saleType: x.SL_itemTax,
  })),
};

return tracker;

In this Javascfript query:

  • I take the id from another js query (which is basically generating a UUID)
  • I addd recipient values depending on whether the fields have a value or not. If they empty then they will not be added to the object
  • I have a toggle to let users decide whether to add an address or not, if this is toggled, then the address is added
  • Similar dinamic to a document

Then, I'll simply add the result of query1 in the query that makes the POST call for my API:

image

I just made sure that the queries trigger in the right sequenc, i.e. first query2 (to generate the id) then query1, to generate the body of the POSt call, and then query3, that makes the post call.

Hope this example helps!