JSON API List Data Store

The JSON API List Data Store allows you to populate a List using JSON calls, enabling flexible integration with external APIs. It offers features like auto-handling filters and improved row creation methods, enhancing its functionality for handling JSON data.

This is an available feature in Joget DX version 8.1 onwards.

Features

  1. Added property Auto Handling Filters for JSON API List Data Store and perform filtering using CQengine.
  2. Support using object key to create row.
  3. Added property Disable object keys as columns to join object key as single column value and object value as another column value.

Property auto handling filters in JSON API list data store

  • Once enabled, you can use the List Builder filter to filtering the JSON API response even the API end point does not support searching/filtering options.
  • Currently, it support all the filter types in List Builder.
  • Example usage of Auto Handling Filters  in App center Homepage > Ability to have a search filter within JSON API List Data Store.

In App Center Homepage > Ability to have a search filter within JSON API List Data Store.

  1. Open the List Builder in the App Center.
  2. Click Data > Configure JSON API.
  3. Check the Auto Handling Filters box.
  4. Add a sample response to retrieve the specific column to be filtered.

Row creation mapping method in JSON API List Data Store

  • Before the change, rows only able to create through array in the JSON API response. Example, using data in Base JSON Object Name for Multirow Data field to create row.
    {
      "data": [
        {
          "key1": "value1",
          "key2": "value2"
        }
      ]
    }
  • When the JSON API response does not having array but only containing object, it will not able to create row previously. Example:
    {
      "data": {
        "key1": {
          "attr1": "Value 1",
          "attr2": "Value 2"
        },
        "key2": {
          "attr1": "Value 1",
          "attr2": "Value 2"
        }
      }
    }

Let say, you want each key in data object to create as rows, we can use data<> in Base JSON Object Name for Multirow Data in this new change. It will tell the plugin to loop all the keys of data and create it as row.

  • This changes also supporting inner object key as rows. Example:
    {
      "key1": {
        "data": {
          "ckey1": {
            "attr1": "Value 1",
            "attr2": "Value 2"
          }
        }
      },
      "key2": {
        "data": {
          "ckey2": {
            "attr1": "Value 1",
            "attr2": "Value 2"
          }
        }
      }
    }

Property disable object keys as columns in JSON API list data store

  • Before this changes, all the keys of object will be create as columns. Example:
    {
       data : [
          {
             key1 : "value1",
             key2 : "value2"
             key3 : {
                ckey1 : "child value1",
                ckey2 : "child value2"
             }
          }
       ]
    }

Will resulting columns key1key2key3.ckey1key3.ckey2.

  • In this new changes, once enabled Disable object keys as columns, for none Base JSON Object Name for Multirow Data object, it will join the object keys as single column and the value as another column. For the same response above, it will resulting column as key1key2key3.KEYkey3.VALUE. The value of key3.KEY will be ckey1;ckey2 and value of key3.VALUE will be child value1;child value2.

Configure JSON API

  1. To set up an external directory, go to Data, then select Data Store.
  2. Select Source of Data (Data Store): Choose JSON API.


Fields to Configure:

  • JSON URL: URL to be called. Mandatory field. For example with pagination, https://example.com/api/data?pageSize={size}&startOffset={start}
    • pageSize={size}: This parameter is intended to specify the number of items (data entries) to be returned in a single page or response. The actual value for {size} would be replaced with a numerical value indicating the desired page size.
    • startOffset={start}: This parameter is intended to specify the starting offset or index from where the data should be retrieved. The actual value for {start} would be replaced with a numerical value indicating the starting point for fetching data.
  • Call Type:
    Options:
    • GET
    • POST
    • PUT
    • DELETE
  • Body Type (Applicable to POST or PUT):
    • Request Parameters:
      Add name(s) and value(s) to the request header.
      Field Description
      Name Name (or Type) of the Request Header
      Value Link or Value of the Request Header
    • Request Parameters as JSON Payload:
      • When the POST Method is set to POST Parameters, these parameters will be sent as an UrlEncodedFormEntity.

      • When the POST Method is set to POST Parameters as JSON Payload, these parameters will be sent as a StringEntity in the form of an escaped JSON string.

    • Custom JSON Payload:
      • Write your own JSON to be the payload. Sent as a StringEntity.
        This option is available only when Custom JSON Payload is selected.
  • Request Headers:
    Add name(s) and value(s) to the request header.
    Field Description
    Name Name (or Type) of the Request Header
    Value Link or Value of the Request Header
  • Passover Current Reaquest Cookies: When checked, Current Request Cookies will be passed to the server with the request.
  • Base JSON Object Name for Multirow Data: Name of the base JSON object (e.g., data).
  • Total Record Count JSON Object Name: Total number of records in the JSON object (e.g., data.total).
  • Primary Key: Unique Identifier of the JSON object (e.g., data.id). Mandatory field.
  • Auto Handling Full Results Paging & Sorting: Enables automatic sorting for the results returned through the JSON URL.
    Uncheck this, if you are performing pagination.
  • Auto Handling Filters: Enables filtering using CQengine even if the API endpoint does not support searching/filtering options.
    • Support using the object key to create a row.
    • Currently, it support all the filter types in List Builder.
  • Debug Mode: Show relevant debug entries in the server log for debugging purposes.
  • Sample Response (for Retrieve Columns): Enter a sample response of how the JSON object is formatted.
    Must insert a sample response into the field if you are performing pagination.
    Example: 
    {
        "data":{
            "id": "G-001",
            "description": "",
            "name": "Managers",
            "organization.name": ""
        }
    }
  • Disable Object Keys as Columns: Joins object keys as a single column value and object values as another column value.

   Download the demo app for JSON API List Data Store:

Created by Julieth Last modified by Aadrian on Dec 13, 2024