All options are optional and can be left empty
Name | Type | Default | Description |
---|---|---|---|
name | string | lowercase label and replace spaces with '_' no label -> name is generated i.e. 'f1' | This value is is the variable name used |
label | string | bool | field.name | This is the label displayed for the field, if you want to hide the label then set this to false The string can also contain mustache i.e. 'My choice {{value}}' |
value | string | function | '' | Function will run once at instantiation |
help | string | '' | This text is used to provide context or help in filling out the field |
columns | integer | 12 | The form is divided into a grid 12 columns wide, this is setting how many of those columns to display this element at, using this you can make milti-column forms |
target | selector | node | If the target is not set then the field is appended to the parent element which is usually the main form but may be a fieldset | |
show | condition | true | This option controls whether this field should be visible to the user, allowing for fields to only be used if certain conditions are met |
edit | condition | true | Similar to show but this option controls whether the field is enabled for interaction |
new gform({fields: [
{type: 'button', name: 'name_example'},
{type: 'button', label: 'Label Example'},
{type: 'button'}
]})
new gform({fields: [
{
type: 'button',
label: 'Label Example'
}
]})
new gform({fields: [
{
type: 'button',
label: 'Value Example',
value: 'This is a test'
}
]})
new gform({fields: [
{
type: 'button',
label: 'Help Example',
help: 'This is some help text'
}
]})
new gform({fields: [
{
type: 'button',
label: 'Column 1',
columns: 4
},
{
type: 'button',
label: 'Column 2',
columns: 8
}
]})
new gform({fields: [
{type: 'button', name: 'name_example'},
{type: 'button', label: 'Label Example'},
{type: 'button'}
]})
new gform({fields: [
{
label: 'Show button Field',
name: 'show',
type: 'checkbox'
},
{
type: 'button',
label: 'button Field',
show:[{
type: 'matches',
name: 'show',
value: true
}]
}
]})
new gform({fields: [
{
label: 'Edit button Field',
name: 'edit',
type: 'checkbox'
},
{
type: 'button',
label: 'button Field',
edit:[{
type: 'matches',
name: 'edit',
value: true
}]
}
]})