Docs
API
-
Config
- barHeight
-
bbar
- bbarHeight
-
buttons
- buttonsHeight
- cls
- defaults
- draggable
-
events
-
footer
- height
- id
- i18n
-
items
- column
-
data
- defaults
- disabled
- displayKey
- editable
- emptyText
- events
-
format
- itemCheckBox
- inputHeight
- inputLabel
- inputWidth
- label
- labelAlign
- labelWidth
- listItemTpl
- leftTpl
- leftWidth
- max
- min
- minListWidth
- multiSelect
- multiToggle
- name
- showPassTip
- spin
- step
- subSearch
- tabIndex
- tip
- type
- value
- valueKey
- vtype
- width
-
lang
-
date
- method
- modal
- params
- renderOuter
- renderTo
- scrollable
- shadow
-
subTitle
-
subTBar
- allowToggle
- action
- cls
- data
- disabled
- displayKey
- editable
- emptyText
- enableToggle
- events
- format
- handler
- hidden
- id
- imageCls
- inputHeight
- itemCheckBox
- leftTpl
- leftWidth
- max
- menu
- minListWidth
- multiSelect
- multiToggle
- paramsMenu
- paramsText
- pressed
- spin
- step
- subSearch
- text
- tip
- toggleGroup
- type
- valueKey
- vtype
- width
- subTBarHeight
-
tbar
- allowToggle
- action
- cls
- data
- disabled
- displayKey
- editable
- emptyText
- enableToggle
- events
- format
- handler
- hidden
- id
- imageCls
- inputHeight
- itemCheckBox
- leftTpl
- leftWidth
- max
- menu
- minListWidth
- multiSelect
- multiToggle
- paramsMenu
- paramsText
- pressed
- spin
- step
- subSearch
- text
- tip
- toggleGroup
- type
- valueKey
- vtype
- width
- tbarHeight
-
title
button
Button field type
Example
items: [{ ... },{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button' },{ ...
Properties
buttonText
StringButton text.
items: [{ label: 'Name', type: 'button', name: 'name', buttonText: 'Button' },{ ...
cls
StringThe CSS class that will be added to field.
It is used for custom styling field.items: [{ type: 'button', label: 'Name', name: 'name', buttonText: 'Button' cls: 'field-name' },{ ... }]
disabled
BooleanDisable field.
items: [{ label: 'Name', type: 'button', name: 'name', buttonText: 'Button', disabled: true },{ ... //Enable field field.enable(); //Disable field field.disable();
enableToggle
BooleanEnables pressed state for button.
... items: [{ label: 'Label', type: 'button', type: 'button', name: 'button', buttonText: 'Button', enableToggle: true },{ ...
... items: [{ label: 'Label', type: 'button', type: 'button', name: 'button', buttonText: 'Button', pressed: true, enableToggle: true },{ ...
events
ArraySet event handler to field.
... items: [{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button', events: [{ click: function(){ } }] },{ ...
handler
FunctionFires on field button click.
... items: [{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button', handler: function(){ } },{ ...
label
StringText of field.
... items: [{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button' },{ ...
labelAlign
StringAlign of label.
Values:
right
,left
,top
.... items: [{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button', labelAlign: 'right' },{ ...
left name
StringName of field over which it is possible to get value of field.
... items: [{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button' },{ ...
pressed
BooleanButton becomes pressed.
To use this property requires to enable toggleenableToggle:true
.... items: [{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button', pressed: true, enableToggle: true },{ ...
tip
String|NumberField tip.
}, { label: 'Name', tip: 'Name', emptyText: 'Name', name: 'name' }, { label: 'SurName', tip: '{value}', emptyText: 'SurName', value: 'Johnson', name: 'surname' }, { label: 'E-mail', emptyText: 'E-mail', name: 'email', tip: function(field, value, label) { return field.label; } }, {
Sample on JSFiddle
undefined type
StringType of field (value - button).
{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button' }
Methods
disable
()Disable field.
field.disable();
enable
()Enable field.
field.enable();
setPressed
(value: Boolean)Change button press state.
Requires propertyenableToggle: true
.items: [{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button', pressed: true, enableToggle: true },{ ... field.setPressed(false);
setText
(value: String)Change button text.
items: [{ type: 'button', name: 'button', buttonText: 'Button' },{ ... field.setText('My Button');
setWidth
(value: Number)Set new field width.
field.setWidth(400);
Events
click
(field: Object)Field button event click.
items: [{ label: 'Label', type: 'button', name: 'button', buttonText: 'Button', events: [{ click: function(){ }, scope: {}//not required }] ...
pressedchange
(field: Object, value: Boolean)Field button pressedchange.
Fires only if propertyenableToggle: true
.items: [{ label: 'Label', type: 'button', name: 'button', enableToggle: true, buttonText: 'Button', events: [{ pressedchange: function(){ } }] ...
-
date