TINY BLOG > Important changes to Tiny Cloud pricing > Find out more

tinymce.ui.Toolbar

Creates a new toolbar.

Settings

name type summary defined by
border String Border box values example: 1 1 1 1 tinymce.ui.Control
classes String Space separated list of classes to add. tinymce.ui.Control
defaults Object Default settings to apply to all items. tinymce.ui.Container
disabled Boolean Is the control disabled by default. tinymce.ui.Control
hidden Boolean Is the control hidden by default. tinymce.ui.Control
items Array Items to add to container in JSON format or control instances. tinymce.ui.Container
layout String Layout manager by name to use. tinymce.ui.Container
margin String Margin box values example: 1 1 1 1 tinymce.ui.Control
minHeight Number Minimal height for the control. tinymce.ui.Control
minWidth Number Minimal width for the control. tinymce.ui.Control
name String Name of the control instance. tinymce.ui.Control
padding String Padding box values example: 1 1 1 1 tinymce.ui.Control
role String WAI-ARIA role to use for control. tinymce.ui.Control
style String Style CSS properties to add. tinymce.ui.Control

Constructors

name summary defined by
Container() Constructs a new control instance with the specified settings. tinymce.ui.Container
Control() Constructs a new control instance with the specified settings. tinymce.ui.Control
Toolbar() Constructs a instance with the specified settings. tinymce.ui.Toolbar

Methods

name summary defined by
active() Sets/gets the active for the control. tinymce.ui.Control
add() Adds one or many items to the current container. This will create instances of the object representations if needed. tinymce.ui.Container
after() Adds items after the current control. tinymce.ui.Control
append() Appends new instances to the current container. tinymce.ui.Container
aria() Sets the specified aria property. tinymce.ui.Control
before() Adds items before the current control. tinymce.ui.Control
blur() Blurs the current control. tinymce.ui.Control
create() Creates the specified items. If any of the items is plain JSON style objects it will convert these into real tinymce.ui.Control instances. tinymce.ui.Container
disabled() Sets/gets the disabled state on the control. tinymce.ui.Control
encode() Encodes the specified string with HTML entities. It will also translate the string to different languages. tinymce.ui.Control
find() Find child controls by selector. tinymce.ui.Container
fire() Fires the specified event by name and arguments on the control. This will execute all bound event handlers. tinymce.ui.Control
focus() Focuses the current container instance. This will look for the first control in the container and focus that. tinymce.ui.Container
fromJSON() Populates the form fields from the specified JSON data object. Control items in the form that matches the data will have it's value set. tinymce.ui.Container
getContainerElm() Returns the root element to render controls into. tinymce.ui.Control
getEl() Returns the control DOM element or sub element. tinymce.ui.Control
getParentCtrl() Returns a control instance for the current DOM element. tinymce.ui.Control
hasEventListeners() Returns true/false if the specified event has any listeners. tinymce.ui.Control
hide() Sets the visible state to false. tinymce.ui.Control
initLayoutRect() Initializes the current controls layout rect. This will be executed by the layout managers to determine the default minWidth/minHeight etc. tinymce.ui.Container
innerHtml() Sets the inner HTML of the control element. tinymce.ui.Control
insert() Inserts an control at a specific index. tinymce.ui.Container
items() Returns a collection of child items that the container currently have. tinymce.ui.Container
layoutRect() Getter/setter for the current layout rect. tinymce.ui.Control
name() Sets/gets the name for the control. tinymce.ui.Control
next() Returns the control next to the current control. tinymce.ui.Control
off() Unbinds the specified event and optionally a specific callback. If you omit the name parameter all event handlers will be removed. If you omit the callback all event handles by the specified name will be removed. tinymce.ui.Control
on() Binds a callback to the specified event. This event can both be native browser events like "click" or custom ones like PostRender. The callback function will be passed a DOM event like object that enables yout do stop propagation. tinymce.ui.Control
parent() Sets/gets the parent container for the control. tinymce.ui.Control
parents() Returns a control collection with all parent controls. tinymce.ui.Control
parentsAndSelf() Returns the current control and it's parents. tinymce.ui.Control
postRender() Called after the control has been rendered. tinymce.ui.Toolbar
prepend() Prepends new instances to the current container. tinymce.ui.Container
prev() Returns the control previous to the current control. tinymce.ui.Control
recalc() Recalculates the positions of the controls in the current container. This is invoked by the reflow method and shouldn't be called directly. tinymce.ui.Container
reflow() Reflows the current container and it's children and possible parents. This should be used after you for example append children to the current control so that the layout managers know that they need to reposition everything. tinymce.ui.Container
remove() Removes the current control from DOM and from UI collections. tinymce.ui.Control
renderBefore() Renders the control to the specified element. tinymce.ui.Control
renderHtml() Renders the control as a HTML string. tinymce.ui.Container
repaint() Repaints the control after a layout operation. tinymce.ui.Control
replace() Replaces the specified child control with a new control. tinymce.ui.Container
scrollIntoView() Scrolls the current control into view. tinymce.ui.Control
show() Sets the visible state to true. tinymce.ui.Control
text() Sets/gets the text for the control. tinymce.ui.Control
title() Sets/gets the title for the control. tinymce.ui.Control
toJSON() Serializes the form into a JSON object by getting all items that has a name and a value. tinymce.ui.Container
translate() Returns the translated string. tinymce.ui.Control
visible() Sets/gets the visible for the control. tinymce.ui.Control

Constructors

Container

public constructor function Container(settings:Object)

Constructs a new control instance with the specified settings.

Parameters
  • settings (Object) - Name/value object with settings.

Control

public constructor function Control(settings:Object)

Constructs a new control instance with the specified settings.

Parameters
  • settings (Object) - Name/value object with settings.

Toolbar

public constructor function Toolbar(settings:Object)

Constructs a instance with the specified settings.

Parameters
  • settings (Object) - Name/value object with settings.

Methods

active

active(state:Boolean):Boolean, tinymce.ui.Control

Sets/gets the active for the control.

Parameters
  • state (Boolean) - Value to set to control.
Return value
  • Boolean - Current control on a set operation or current state on a get.
  • tinymce.ui.Control - Current control on a set operation or current state on a get.

add

add(items:Array):tinymce.ui.Collection

Adds one or many items to the current container. This will create instances of the object representations if needed.

Parameters
  • items (Array) - Array or item that will be added to the container.
Return value

after

after(items:Array):tinymce.ui.Control

Adds items after the current control.

Parameters
  • items (Array) - Array of items to append after this control.
Return value

append

append(items:Array):tinymce.ui.Container

Appends new instances to the current container.

Parameters
  • items (Array) - Array if controls to append.
Return value

aria

aria(name:String, value:String):tinymce.ui.Control

Sets the specified aria property.

Parameters
  • name (String) - Name of the aria property to set.
  • value (String) - Value of the aria property.
Return value

before

before(items:Array):tinymce.ui.Control

Adds items before the current control.

Parameters
  • items (Array) - Array of items to prepend before this control.
Return value

blur

blur():tinymce.ui.Control

Blurs the current control.

Return value

create

create(items:Array):Array

Creates the specified items. If any of the items is plain JSON style objects it will convert these into real tinymce.ui.Control instances.

Parameters
  • items (Array) - Array of items to convert into control instances.
Return value
  • Array - Array with control instances.

disabled

disabled(state:Boolean):Boolean, tinymce.ui.Control

Sets/gets the disabled state on the control.

Parameters
  • state (Boolean) - Value to set to control.
Return value
  • Boolean - Current control on a set operation or current state on a get.
  • tinymce.ui.Control - Current control on a set operation or current state on a get.

encode

encode(text:String, translate:Boolean):String

Encodes the specified string with HTML entities. It will also translate the string to different languages.

Parameters
  • text (String) - Text to entity encode.
  • translate (Boolean) - False if the contents shouldn't be translated.
Return value
  • String - Encoded and possible traslated string.

find

find(selector:String):tinymce.ui.Collection

Find child controls by selector.

Parameters
  • selector (String) - Selector CSS pattern to find children by.
Return value

fire

fire(name:String, args:Object, bubble:Boolean):Object

Fires the specified event by name and arguments on the control. This will execute all bound event handlers.

Parameters
  • name (String) - Name of the event to fire.
  • args (Object) - Arguments to pass to the event.
  • bubble (Boolean) - Value to control bubbling. Defaults to true.
Return value
  • Object - Current arguments object.

focus

focus(keyboard:Boolean):tinymce.ui.Collection

Focuses the current container instance. This will look for the first control in the container and focus that.

Parameters
  • keyboard (Boolean) - Optional true/false if the focus was a keyboard focus or not.
Return value

fromJSON

fromJSON(data:Object):tinymce.ui.Container

Populates the form fields from the specified JSON data object. Control items in the form that matches the data will have it's value set.

Parameters
  • data (Object) - JSON data object to set control values by.
Return value

getContainerElm

getContainerElm():Element

Returns the root element to render controls into.

Return value
  • Element - HTML DOM element to render into.

getEl

getEl(suffix:String):Element

Returns the control DOM element or sub element.

Parameters
  • suffix (String) - Suffix to get element by.
Return value
  • Element - HTML DOM element for the current control or it's children.

getParentCtrl

getParentCtrl(elm:Element):tinymce.ui.Control

Returns a control instance for the current DOM element.

Parameters
  • elm (Element) - HTML dom element to get parent control from.
Return value

hasEventListeners

hasEventListeners(name:String):Boolean

Returns true/false if the specified event has any listeners.

Parameters
  • name (String) - Name of the event to check for.
Return value
  • Boolean - True/false state if the event has listeners.

hide

hide():tinymce.ui.Control

Sets the visible state to false.

Return value

initLayoutRect

initLayoutRect():Object

Initializes the current controls layout rect. This will be executed by the layout managers to determine the default minWidth/minHeight etc.

Return value
  • Object - Layout rect instance.

innerHtml

innerHtml(html:String):tinymce.ui.Control

Sets the inner HTML of the control element.

Parameters
  • html (String) - Html string to set as inner html.
Return value

insert

insert(items:Array, index:Number, before:Boolean)

Inserts an control at a specific index.

Parameters
  • items (Array) - Array if controls to insert.
  • index (Number) - Index to insert controls at.
  • before (Boolean) - Inserts controls before the index.

items

items():tinymce.ui.Collection

Returns a collection of child items that the container currently have.

Return value

layoutRect

layoutRect(newRect:Object):tinymce.ui.Control, Object

Getter/setter for the current layout rect.

Parameters
  • newRect (Object) - Optional new layout rect.
Return value
  • tinymce.ui.Control - Current control or rect object.
  • Object - Current control or rect object.

name

name(value:String):String, tinymce.ui.Control

Sets/gets the name for the control.

Parameters
  • value (String) - Value to set to control.
Return value
  • String - Current control on a set operation or current value on a get.
  • tinymce.ui.Control - Current control on a set operation or current value on a get.

next

next():tinymce.ui.Control

Returns the control next to the current control.

Return value

off

off(name:String, callback:function):tinymce.ui.Control

Unbinds the specified event and optionally a specific callback. If you omit the name parameter all event handlers will be removed. If you omit the callback all event handles by the specified name will be removed.

Parameters
  • name (String) - Name for the event to unbind.
  • callback (function) - Callback function to unbind.
Return value

on

on(name:String, callback:String):tinymce.ui.Control

Binds a callback to the specified event. This event can both be native browser events like "click" or custom ones like PostRender. The callback function will be passed a DOM event like object that enables yout do stop propagation.

Parameters
  • name (String) - Name of the event to bind. For example "click".
  • callback (String) - Callback function to execute ones the event occurs.
Return value

parent

parent(parent:tinymce.ui.Container):tinymce.ui.Control

Sets/gets the parent container for the control.

Parameters
Return value

parents

parents(selector:String):tinymce.ui.Collection

Returns a control collection with all parent controls.

Parameters
  • selector (String) - Optional selector expression to find parents.
Return value

parentsAndSelf

parentsAndSelf(selector:String):tinymce.ui.Collection

Returns the current control and it's parents.

Parameters
  • selector (String) - Optional selector expression to find parents.
Return value

postRender

postRender()

Called after the control has been rendered.

prepend

prepend(items:Array):tinymce.ui.Container

Prepends new instances to the current container.

Parameters
  • items (Array) - Array if controls to prepend.
Return value

prev

prev():tinymce.ui.Control

Returns the control previous to the current control.

Return value

recalc

recalc()

Recalculates the positions of the controls in the current container. This is invoked by the reflow method and shouldn't be called directly.

reflow

reflow():tinymce.ui.Container

Reflows the current container and it's children and possible parents. This should be used after you for example append children to the current control so that the layout managers know that they need to reposition everything.

Examples
container.append({type: 'button', text: 'My button'}).reflow();
Return value

remove

remove():tinymce.ui.Control

Removes the current control from DOM and from UI collections.

Return value

renderBefore

renderBefore(elm:Element):tinymce.ui.Control

Renders the control to the specified element.

Parameters
  • elm (Element) - Element to render to.
Return value

renderHtml

renderHtml():String

Renders the control as a HTML string.

Return value
  • String - HTML representing the control.

repaint

repaint()

Repaints the control after a layout operation.

replace

replace(oldItem:tinymce.ui.Control, newItem:tinymce.ui.Control)

Replaces the specified child control with a new control.

Parameters

scrollIntoView

scrollIntoView(align:String):tinymce.ui.Control

Scrolls the current control into view.

Parameters
  • align (String) - Alignment in view top|center|bottom.
Return value

show

show():tinymce.ui.Control

Sets the visible state to true.

Return value

text

text(value:String):String, tinymce.ui.Control

Sets/gets the text for the control.

Parameters
  • value (String) - Value to set to control.
Return value
  • String - Current control on a set operation or current value on a get.
  • tinymce.ui.Control - Current control on a set operation or current value on a get.

title

title(value:String):String, tinymce.ui.Control

Sets/gets the title for the control.

Parameters
  • value (String) - Value to set to control.
Return value
  • String - Current control on a set operation or current value on a get.
  • tinymce.ui.Control - Current control on a set operation or current value on a get.

toJSON

toJSON():Object

Serializes the form into a JSON object by getting all items that has a name and a value.

Return value
  • Object - JSON object with form data.

translate

translate(text:String):String

Returns the translated string.

Parameters
  • text (String) - Text to translate.
Return value
  • String - Translated string or the same as the input.

visible

visible(state:Boolean):Boolean, tinymce.ui.Control

Sets/gets the visible for the control.

Parameters
  • state (Boolean) - Value to set to control.
Return value
  • Boolean - Current control on a set operation or current state on a get.
  • tinymce.ui.Control - Current control on a set operation or current state on a get.

Can't find what you're looking for? Let us know.

Except as otherwise noted, the content of this page is licensed under the Creative Commons BY-NC-SA 3.0 License, and code samples are licensed under the Apache 2.0 License.