Schema
The schema contains the fields of the form, optionally in groups.

Examples

Simple form without groups

This simple form will have a text input for Name and a numeric input for Age.
1
{
2
fields: [
3
{
4
type: "input",
5
inputType: "text",
6
label: "Name",
7
model: "name"
8
},
9
{
10
type: "input",
11
inputType: "number",
12
id: "current_age",
13
label: "Age",
14
model: "age"
15
}
16
]
17
}
Copied!

Simple form with groups

This form will have two sections:
  • A "User Details" section, with a text input for username and an email input
  • A "Preferences" section, with a select input for color and a numeric input for timeout
Sections are currently output as <fieldset> elements, with a <legend>.
1
{
2
groups: [
3
{
4
legend: "User Details",
5
fields: [
6
{
7
type: "input",
8
inputType: "text",
9
label: "Username",
10
model: "username"
11
},
12
{
13
type: "input",
14
inputType: "email",
15
id: "email",
16
label: "Email Address",
17
model: "email"
18
}
19
]
20
},
21
{
22
legend: "Preferences",
23
fields: [
24
{
25
type: "select",
26
label: "Color",
27
model: "color",
28
values: [
29
"Red",
30
"Green",
31
"Blue"
32
]
33
},
34
{
35
type: "input",
36
inputType: "number",
37
id: "timeout",
38
label: "Timeout in Seconds",
39
model: "timeout"
40
}
41
]
42
}
43
]
44
}
Copied!
It is also possible to have a schema with some fields grouped and some ungrouped:
1
{
2
fields: [
3
{
4
type: "input",
5
inputType: "text",
6
label: "Name",
7
model: "name"
8
}
9
],
10
groups: [
11
{
12
legend: "User Details",
13
fields: [
14
{
15
type: "input",
16
inputType: "number",
17
id: "current_age",
18
label: "Age",
19
model: "age"
20
}
21
]
22
}
23
]
24
}
Copied!
This form would have a text input for Name, followed by a fieldset for "User Details", containing a numeric input for Age.
Note: any ungrouped fields will be output first, followed by any groups.
Last modified 3yr ago