Array Field

The array field.

Properties

Title Array
Description Field for list of items with same data type or structure.
Field Type array
Base Field Type container

Schema

Property Type Default Description
items object Schema for array items.
maxItems number Maximum number of items.
minItems number Minimum number of items.
uniqueItems boolean Item values should be unique if true.

Options

Property Type Default Description
animate boolean true Up and down transitions will be animated
collapsed boolean Field set is initially collapsed if true.
collapsible boolean Field set is collapsible if true.
lazyLoading boolean Child fields will only be rendered when the fieldset is expanded if this option is set true.
legendStyle string button Field set legend style.
properties

Example 1

{% raw %} {% endraw %}

Example 2

Here we use the hideToolbarWithChildren option to keep the top-most button available to add new items to the list. We also hide the add button in the action bar for each row.

{% raw %} {% endraw %}

Example 3

{% raw %} {% endraw %}

Example 4

{% raw %} {% endraw %}

Example 5

{% raw %} {% endraw %}

Example 6

{% raw %} {% endraw %}

Example 7

{% raw %} {% endraw %}

Example 8

{% raw %} {% endraw %}

Example 9

{% raw %} {% endraw %}

Example 10

rendered by the view into the form and usually appear as a button bar.

For the toolbar, Alpaca assumes and auto-populates a single button - add.

For the actionbar (per item), Alpaca assumes and auto-populates the following buttons:

  • add
  • remove
  • up
  • down

Any properties you define for these actions will override the existing presets. Any new actions you define will be added to the overall set. You can explicitly enable or disable actions via the enabled property. Disabled actions are removed from display.

By default, the array field keeps labels turned off. If you want to turn labels on, use the toolbar.showLabels and actionbar.showLabels options.

{% raw %} {% endraw %}

Example 11

{% raw %} {% endraw %}

Example 12

{% raw %} {% endraw %}

Example 13

{% raw %} {% endraw %}

Example 14

{% raw %} {% endraw %}

Example 15

{% raw %} {% endraw %}

Example 16

{% raw %} {% endraw %}

Example 17

{% raw %} {% endraw %}