Bind data using Connectors

You are now aware of the different connectors that you can use to integrate the functionalities of services like Slack, Trello, as well as Databases like MySQL, Postgres and so on to enhance the functionalities of your apps. You can bind the data from these connectors to your controls like Tablegrid control, Detail view control, List controls, and even some other input controls as per your scenario.

Now let us consider an example here of a MongoDB Connector to fetch data from one of the Author collections and display it in a Tablegrid control. Now if you already have configured your connector and added it to the current app you will find that it is listed out under the Connectors. However, if you have not configured one yet, then you can add that connector.

Add new connector

In case you have not configured any connector yet and want to add a new connector when binding data, you can do so using the connector tab under Bind data.

  • Select the Tablegrid control and go to Bind data. Here you have the Connector as a source for data.
  • Click + icon to add a new connector.
  • Select the connector from the list and now configure the Connector using the authenticated account and providing the input for any input or dynamic fields.
  • Once configured, you would find it in the list of connectors available.
  • From here you can add the configured connector and bind the keys accordingly.

Add configured connector

Let us first see how to bind data from an already configured connector.

  • Select the Tablegrid control and go to Bind data. Here you have the Connector as a source for data. Select the Connector for MongoDB in this example.

  • Select the respective connector and then select the keys for the data to be bound to the control.
  • Here you can also set the Column visibility. Simply click the eye icon to switch on or off the Column Visibility.
  • Click Save and your connector is bound to the control. You can view data as per the given connector configuration whenever you run the app.

Edit Selected Connector

Now that you have seen how to add the connectors, you would also find it useful to make some changes as required to your connectors. You can Edit the connector by simply using the Edit Selected connector.

Make the necessary changes to the connector and click Finish.

Let us take an example form where you display the author to check the output of a connector.

Once you have saved the connector configurations you can view the function working in the Custom Formula. For connectors, it is the BINDAPI() function that would be responsible for fetching the data from the configured connectors.

If you want to add another column from the connector you can edit the Custom Formula. Type in the fields as connectorname.result.rows.columnname. You can add other functions like MAPKEYS() to modify the output for improved presentation.

To know more about BindAPI() and its parameters refer to the article here.

Now let us see the output of this action.

Note the headings for the columns in the table grid. Now you can change the column headers to simple user-friendly headings. To do so you simply need to go to Custom Formula > Header labels. Add the headers according to your data and click Save and Validate. You can also use the Connectors option under Data. Here the selected keys are listed out. Now if you select any of the keys/columns it can be edited or changed. So you can change the column header using this method as well.

Now if you run the form, you can see that the headings have been changed to that set in the Header labels.

These were a few basic functions that you can use for your connectors. There are a few more features that allow you to format and transform your Connector data. You can refer to these articles to know more about format data, transform data, and transform response.