Flexberry Documentation
FlexberryButtonComponent Class
Flexberry button component with Semantic UI button style.
Usage: templates/my-form.hbs
{{flexberry-button
caption="My button"
click=(action "onMyButtonClick")
}}
controllers/my-form.js
actions: {
onMyButtonClick(e) {
// Log jQuery 'click' event object triggered after checkbox input was clicked.
console.log('My button clicked. jQuery \'click\' event-object: ', e.originalEvent);
}
}
Item Index
Methods
Methods
_actionHandlerIsDefined
(
Boolean
private
-
options
Returns flag, indicating whether action handler is defined, for action with the specified name, or not.
Parameters:
Returns:
Boolean:
Flag, indicating whether action handler is defined, for action with the specified name, or not.
_addDynamicProperty
(
private
-
propertyName
Adds component's new dynamic property.
Gets related value from {{#crossLink "DynamicPropertiesMixin:dynamicProperties:property"}}dynamic properties{{/crossLink}},
and assignes it to related component's property, then attaches observer.
Parameters:
-
propertyNameStringName of dynamic property that must be added.
_dynamicPropertiesDidChange
()
private
Observes & handles any changes in
{{#crossLink "DynamicPropertiesMixin/dynamicProperties:property"}}'dynamicProperties'{{/crossLink}},
assigns actual values to a component's related properties (including initialization moment).
_removeDynamicProperties
()
private
Removes component's all previously added dynamic properties.
Removes related component's properties & observers.
_removeDynamicProperty
(
private
-
propertyName
Removes component's previously added dynamic property.
Removes related component's property & observer.
Parameters:
-
propertyNameStringName of dynamic property that must be removed.
Properties
_componentWrapperIsAvailable
Boolean
private
Flag: indicates whether component's wrapper DOM-element is available for select now.
_dynamicActions
Object
private
Component's dynamic actions from
{{#crossLink "DynamicActionsMixin:dynamicActions:property"}}'dynamicActions' property{{/crossLink}},
mapped from array into flat [JSON-object](http://www.json.org/).
_dynamicPropertiesMetadata
Object[]
private
Array with objects containing names of already assigned
{{#crossLink "DynamicPropertiesMixin:dynamicProperties:property"}}dynamic properties{{/crossLink}}
and observer handlers related to them.
Each object in array has following structure: { propertyName: '...', propertyObserverHandler: function() { ... } }.
Default: null
_requiredActions
String[]
Component's required actions names.
For actions enumerated in this array an assertion exceptions will be thrown,
if actions handlers are not defined for them.
Default: null
classNameBindings
String[]
Components class names bindings.
Default: ['readonly:disabled', '_hasIconOnly:icon']
classNames
String[]
Component's wrapping
CSS-classes names.
Any other CSS-classes can be added through component's 'class' property.
{{flexberry-button
class="red"
caption="My red button"
click=(action "onMyRedButtonClick")
}}
Default: ['flexberry-button', 'ui', 'button']
dynamicActions
DynamicActionObject[]
Component's dynamic actions.
If component consumes it's inner structure as [JSON-object](http://www.json.org/)
or [Ember-object](https://emberjs.com/api/ember/release/classes/EmberObject)
and there is no way to attach action handlers explicitly in hbs-markup,
then you can define {{#crossLink "DynamicActionObject"}}dynamic actions{{/crossLink}}
somewhere in code & pass defined array into this component's property.
Default: null
dynamicProperties
Object
Object containing dynamic properties that must be assigned to
component using {{#crossLink "DynamicPropertiesMixin"}}dynamic-properties mixin{{/crossLink}}.
Default: null
isTagless
Boolean
Flag: indicates whether component is tagless or not
(has empty [tagName](https://emberjs.com/api/ember/release/classes/Component#property_tagName) or not).
tooltip
Unknown
Component's tooltip text. Will be added as wrapper's element 'title' attribute.
Default: null