set

Set field type

This field group items in container.

Example


items: [{
  type: 'set',
  label: 'User Info',
  checkbox: true,
  defaults: {
    inputWidth: 180,
    labelWidth: 90,
  },
  items: [{
    type: 'string',
    label: 'Login',
    emptyText: 'Login',
    name: 'login'
  },{
    type: 'password',
    label: 'Password',
    emptyText: 'Password',
    name: 'password'
  }]
},{
...

Properties

events

^Array

Set event handler to field.


...
items: [{
  type: 'set',
  label: 'User Info',
  checkbox: true,
  items: [{
    type: 'string',
    label: 'First Name',
    emptyText: 'First Name',
    name: 'name'
  }, {
    type: 'string',
    label: 'Last Name',
    emptyText: 'Last Name',
    name: 'surname'
  }],
  events: [{
    beforecollapse: function(){
      
    }
  },{
    collapse: function(){
	
	}
  },{
    beforeexpand: function(){
	
	}
  },{
    expand: function(){
	
	}
  }]
},{
...

items

^Array

Wrapped fields.


...
items: [{
  type: 'set',
  label: 'User Info',
  checkbox: true,
  items: [{
    type: 'string',
    label: 'First Name',
    emptyText: 'First Name',
    name: 'name'
  }, {
    type: 'string',
    label: 'Last Name',
    emptyText: 'Last Name',
    name: 'surname'
  }],
},{
...

label

^String

Text of field.


...
items: [{
  type: 'set',
  label: 'User Info',
  checkbox: true,
  items: [{
    type: 'string',
    label: 'First Name',
    emptyText: 'First Name',
    name: 'name'
  }, {
    type: 'string',
    label: 'Last Name',
    emptyText: 'Last Name',
    name: 'surname'
  }],
},{
...

type

^String

Type of field (value - set).


{
  type: 'set',
  label: 'User Info',
  checkbox: true,
  items: [{
    type: 'string',
    label: 'First Name',
    emptyText: 'First Name',
    name: 'name'
  }, {
    type: 'string',
    label: 'Last Name',
    emptyText: 'Last Name',
    name: 'surname'
  }]
}

Events

beforecollapse

^(field)

Event that fires before collapsing items.


items: [{
  type: 'radio',
  label: 'Favorite car brand?',
  name: 'brand',
  value: 'kia',
  items: [{
    text: 'KIA',
    value: 'kia'
  },{
    text: 'Honda',
    value: 'honda'
  },{
    text: 'Land Rover',
    value: 'lr'
  },{
    text: 'Toyota',
    value: 'toyota'
  }],
  events: [{
    beforecollapse: function(){
      
    }
  }]
...

beforeexpand

^(field)

Event that fires before expanding items.


items: [{
  type: 'radio',
  label: 'Favorite car brand?',
  name: 'brand',
  value: 'kia',
  items: [{
    text: 'KIA',
    value: 'kia'
  },{
    text: 'Honda',
    value: 'honda'
  },{
    text: 'Land Rover',
    value: 'lr'
  },{
    text: 'Toyota',
    value: 'toyota'
  }],
  events: [{
    beforeexpand: function(){
      
    }
  }]
...

collapse

^(field)

Event that fires when items were collapsed.


items: [{
  type: 'radio',
  label: 'Favorite car brand?',
  name: 'brand',
  value: 'kia',
  items: [{
    text: 'KIA',
    value: 'kia'
  },{
    text: 'Honda',
    value: 'honda'
  },{
    text: 'Land Rover',
    value: 'lr'
  },{
    text: 'Toyota',
    value: 'toyota'
  }],
  events: [{
    collapse: function(){
      
    }
  }]
...

expand

^(field)

Event that fires when items were expanded.


items: [{
  type: 'radio',
  label: 'Favorite car brand?',
  name: 'brand',
  value: 'kia',
  items: [{
    text: 'KIA',
    value: 'kia'
  },{
    text: 'Honda',
    value: 'honda'
  },{
    text: 'Land Rover',
    value: 'lr'
  },{
    text: 'Toyota',
    value: 'toyota'
  }],
  events: [{
    expand: function(){
      
    }
  }]
...