Array Example

The array renderer is used, when an object with type array is used.

To get a good overview, have a look at the Schema tab in the demo below.

Demo

Comments 2
Date	Message	Enum
	must NOT have more than 5 characters	​
	must NOT have more than 5 characters	​

Schema

schema.json

{
  "type": "object",
  "properties": {
    "comments": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "date": {
            "type": "string",
            "format": "date"
          },
          "message": {
            "type": "string",
            "maxLength": 5
          },
          "enum": {
            "type": "string",
            "enum": [
              "foo",
              "bar"
            ]
          }
        }
      }
    }
  }
}

UI Schema

uischema.json

{
  "type": "VerticalLayout",
  "elements": [
    {
      "type": "Control",
      "scope": "#/properties/comments"
    }
  ]
}

Data

{
  "comments": [
    {
      "date": "2001-09-11",
      "message": "This is an example message"
    },
    {
      "date": "2024-10-18",
      "message": "Get ready for booohay"
    }
  ]
}

Our current array renderer is not supported on mobile, sorry.