Dynamic UI components building using API JSON response

I have to create Dynamic UI meaning based on the API JSON response received.

I will be receiving the input type like check box or input and all the other attributes in JSON response, using that can i create the component and create dynamic UI?

  Discussion posts and replies are publicly visible

Parents Reply
  • Here's a simple example to get you going. Your API would have to send you something along those lines.

    You'll have a hard time storing this in the DB in a relational schema unless you are just storing the json that you will be sending back to the API.

    a!localVariables(
      local!objectMap: {
        a!map(
          type: "text",
          label: "Name",
          key: "Name",
          value: null
        ),
        a!map(
          type: "dropdown",
          label: "Type",
          key: "type",
          choiceLabels: {
            "Value 1",
            "Value 2",
            "Value 3"
          },
          choiceValues: {
            "Value 1",
            "Value 2",
            "Value 3"
          },
          value: null
        )
      },
      a!forEach(
        items: local!objectMap,
        expression: a!match(
          value: fv!item.type,
          equals: "text",
          then: a!textField(
            label: fv!item.label,
            value: fv!item.value,
            saveInto: fv!item.value
          ),
          equals: "dropdown",
          then: a!dropdownField(
            label: fv!item.label,
            placeholder: "Choose a value",
            choiceLabels: fv!item.choiceLabels,
            choiceValues: fv!item.choiceValues,
            value: fv!item.value,
            saveInto: fv!item.value
          ),
          default: {}
        )
      )
    )

Children