IControlTypeContent

types.IControlTypeContent

HierarchyHierarchy

• IControlTypeStrong

  ↳ IControlTypeContent

texttext

Optional text: string

Inherited fromInherited from

IControlTypeStrong.text

Defined inDefined in

src/types/toolbar.d.ts#32

textTemplatetextTemplate

Optional textTemplate: (jodit: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, value: string) => string

Type declarationType declaration

(jodit, value): string

ParametersParameters

ReturnsReturns

string

Inherited fromInherited from

IControlTypeStrong.textTemplate

Defined inDefined in

src/types/toolbar.d.ts#33

modemode

Optional mode: 1 | 2 | 3

Inherited fromInherited from

IControlTypeStrong.mode

Defined inDefined in

src/types/toolbar.d.ts#35

hotkeyshotkeys

Optional hotkeys: string | string[]

Inherited fromInherited from

IControlTypeStrong.hotkeys

Defined inDefined in

src/types/toolbar.d.ts#36

datadata

Optional data: IDictionary

Inherited fromInherited from

IControlTypeStrong.data

Defined inDefined in

src/types/toolbar.d.ts#37

isInputisInput

Optional isInput: boolean

Inherited fromInherited from

IControlTypeStrong.isInput

Defined inDefined in

src/types/toolbar.d.ts#39

componentcomponent

Optional component: "button" | "select"

Inherited fromInherited from

IControlTypeStrong.component

Defined inDefined in

src/types/toolbar.d.ts#41

isVisibleisVisible

Optional isVisible: (editor: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, control: IControlType<IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, IToolbarButton>) => boolean

Type declarationType declaration

(editor, control): boolean

ParametersParameters

ReturnsReturns

boolean

Inherited fromInherited from

IControlTypeStrong.isVisible

Defined inDefined in

src/types/toolbar.d.ts#43

isActiveisActive

Optional isActive: (editor: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, button: IToolbarButton) => boolean

You can use it function for control - active/not active button

See

copyformat plugin

Example

var editor = Jodit.make('.selectorclass', {
    buttons: {
         checkbox: {
             data: {
                 active: false,
             },
             iconURL: 'checkbox.png',
             exec: function (a, b, btn) {
                 btn.data.active = !btn.data.active;
             },
             isActive: function (editor, btn) {
                 return !!btn.data.active;
             }
         }
    }
})

Type declarationType declaration

(editor, button): boolean

You can use it function for control - active/not active button

ParametersParameters

ReturnsReturns

boolean

See

copyformat plugin

Example

var editor = Jodit.make('.selectorclass', {
    buttons: {
         checkbox: {
             data: {
                 active: false,
             },
             iconURL: 'checkbox.png',
             exec: function (a, b, btn) {
                 btn.data.active = !btn.data.active;
             },
             isActive: function (editor, btn) {
                 return !!btn.data.active;
             }
         }
    }
})

Inherited fromInherited from

IControlTypeStrong.isActive

Defined inDefined in

src/types/toolbar.d.ts#69

updateupdate

Optional update: (editor: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, button: IToolbarButton) => void

Type declarationType declaration

(editor, button): void

ParametersParameters

ReturnsReturns

void

Inherited fromInherited from

IControlTypeStrong.update

Defined inDefined in

src/types/toolbar.d.ts#71

isChildActiveisChildActive

Optional isChildActive: (editor: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, button: IToolbarButton) => boolean

Type declarationType declaration

(editor, button): boolean

ParametersParameters

ReturnsReturns

boolean

Inherited fromInherited from

IControlTypeStrong.isChildActive

Defined inDefined in

src/types/toolbar.d.ts#73

isDisabledisDisabled

Optional isDisabled: (editor: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, button: IToolbarButton) => boolean

You can use it function for control - disable/enable button

See

copyformat plugin

Example

var editor = Jodit.make('.selectorclass', {
    buttons: {
         checkbox: {
             data: {
                 enable: false,
             },
             iconURL: 'checkbox.png',
             exec: function (a, b, btn) {
                 btn.data.active = !btn.data.active;
             },
             isDisabled: function (editor, btn) {
                 return !!btn.data.enable;
             }
         }
    }
})

Type declarationType declaration

(editor, button): boolean

You can use it function for control - disable/enable button

ParametersParameters

ReturnsReturns

boolean

See

copyformat plugin

Example

var editor = Jodit.make('.selectorclass', {
    buttons: {
         checkbox: {
             data: {
                 enable: false,
             },
             iconURL: 'checkbox.png',
             exec: function (a, b, btn) {
                 btn.data.active = !btn.data.active;
             },
             isDisabled: function (editor, btn) {
                 return !!btn.data.enable;
             }
         }
    }
})

Inherited fromInherited from

IControlTypeStrong.isDisabled

Defined inDefined in

src/types/toolbar.d.ts#101

isChildDisabledisChildDisabled

Optional isChildDisabled: (editor: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, button: IToolbarButton) => boolean

Type declarationType declaration

(editor, button): boolean

ParametersParameters

ReturnsReturns

boolean

Inherited fromInherited from

IControlTypeStrong.isChildDisabled

Defined inDefined in

src/types/toolbar.d.ts#103

listlist

Optional list: string[] | IDictionary<string | number> | number[]

Drop-down list. A hash or array. You must specify the command which will be submitted for the hash key
(or array value) (see .IJodit.execCommand or define 'exec' function. See example

Example

Jodit.make('#editor2', {
    buttons: Jodit.defaultOptions.buttons.concat([{
       name: 'listsss',
       iconURL: 'stuf/dummy.png',
       list: {
           h1: 'insert Header 1',
           h2: 'insert Header 2',
           clear: 'Empty editor',
       },
       exec: (editor, current, control) => {
            var key = control.args[0],
               value = control.args[1];

            if (key === 'clear') {
                this.setEditorValue('');
                return;
            }
            this.s.insertNode(this.c.element(key, ''));
            this.message.info('Was inserted ' + value);
       },
       template: function (key, value) {
           return '<div>' + value + '</div>';
       }
 });

Inherited fromInherited from

IControlTypeStrong.list

Defined inDefined in

src/types/toolbar.d.ts#136

commandcommand

Optional command: string

The command executes when the button is pressed. Allowed all

See

https://developer.mozilla.org/ru/docs/Web/API/Document/execCommand#commands
and several specific IJodit.execCommand

Inherited fromInherited from

IControlTypeStrong.command

Defined inDefined in

src/types/toolbar.d.ts#143

tagRegExptagRegExp

Optional tagRegExp: RegExp

Inherited fromInherited from

IControlTypeStrong.tagRegExp

Defined inDefined in

src/types/toolbar.d.ts#144

tagstags

Optional tags: HTMLTagNames[]

Tag list: when cursor inward tag from this list, button will be highlighted

Inherited fromInherited from

IControlTypeStrong.tags

Defined inDefined in

src/types/toolbar.d.ts#149

csscss

Optional css: IDictionary<string | string[]>

Inherited fromInherited from

IControlTypeStrong.css

Defined inDefined in

src/types/toolbar.d.ts#151

iconicon

Optional icon: string

String name for existing icons.

Example

var editor = Jodit.make('.editor', {
 buttons: [
     {
         icon: 'source',
         exec: function (editor) {
             editor.toggleMode();
         }
     }
 ]
})

Inherited fromInherited from

IControlTypeStrong.icon

Defined inDefined in

src/types/toolbar.d.ts#169

iconURLiconURL

Optional iconURL: string

Use this property if you want set background image for the button. This icon can be 16 * 16 px in SVG or
another image formats

Inherited fromInherited from

IControlTypeStrong.iconURL

Defined inDefined in

src/types/toolbar.d.ts#175

tooltiptooltip

Optional tooltip: string | (editor: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, control: IControlType<IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, IToolbarButton>, button?: IToolbarButton) => string

Buttons hint

Inherited fromInherited from

IControlTypeStrong.tooltip

Defined inDefined in

src/types/toolbar.d.ts#180

execexec

Optional exec: (view: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, current: Nullable<Node>, options: { control: IControlType<IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, IToolbarButton> ; originalEvent: Event ; button: IToolbarButton }) => any

This function will be executed when the button is pressed.

Type declarationType declaration

(view, current, options): any

This function will be executed when the button is pressed.

ParametersParameters

ReturnsReturns

any

Inherited fromInherited from

IControlTypeStrong.exec

Defined inDefined in

src/types/toolbar.d.ts#187

childExecchildExec

Optional childExec: (view: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, current: Nullable<Node>, options: { parentControl: IControlType<IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, IToolbarButton> ; control: IControlType<IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, IToolbarButton> ; originalEvent: Event ; button: IToolbarButton }) => any

Allows you to set a separate handler for list items

Example

Jodit.make('.editor', {
  buttons: [
    {
      name: 'add-date',
      iconURL: 'stuf/dummy.png',
      list: {
        options: 'Open options',
      },
      exec(editor, current, control) {
        editor.s.insertHTML(new Date().toString());
      },
      childExec(editor, current, control) {
        if (control.args[0] === 'options') {
          editor.alert('Options');
        }
      }
    }
  ]
})

Type declarationType declaration

(view, current, options): any

Allows you to set a separate handler for list items

ParametersParameters

ReturnsReturns

any

Example

Jodit.make('.editor', {
  buttons: [
    {
      name: 'add-date',
      iconURL: 'stuf/dummy.png',
      list: {
        options: 'Open options',
      },
      exec(editor, current, control) {
        editor.s.insertHTML(new Date().toString());
      },
      childExec(editor, current, control) {
        if (control.args[0] === 'options') {
          editor.alert('Options');
        }
      }
    }
  ]
})

Inherited fromInherited from

IControlTypeStrong.childExec

Defined inDefined in

src/types/toolbar.d.ts#222

argsargs

Optional args: any[]

Inherited fromInherited from

IControlTypeStrong.args

Defined inDefined in

src/types/toolbar.d.ts#233

templatetemplate

Optional template: (jodit: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, key: string, value: string) => string

The method which will be called for each element of button.list

Type declarationType declaration

(jodit, key, value): string

The method which will be called for each element of button.list

ParametersParameters

ReturnsReturns

string

Inherited fromInherited from

IControlTypeStrong.template

Defined inDefined in

src/types/toolbar.d.ts#238

childTemplatechildTemplate

Optional childTemplate: (jodit: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, key: string, value: string, button: IToolbarButton) => string

Type declarationType declaration

(jodit, key, value, button): string

ParametersParameters

ReturnsReturns

string

Inherited fromInherited from

IControlTypeStrong.childTemplate

Defined inDefined in

src/types/toolbar.d.ts#240

popuppopup

Optional popup: (jodit: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, current: Nullable<Node>, close: () => void, button: IToolbarButton) => string | false | HTMLElement | IUIElement

After click on the button it will show popup element which consist value that this function returned

Example

var editor = Jodit.make('.editor', {
   buttons: [
     {
         icon: "insertCode",
         popup: function (editor) {
             var div = document.createElement('div'), button = dccument.createElement('button');
             div.innerHTML = 'Hi! Click button and enter your code';
             button.innerHTML = 'Click me';

             div.appendChild(button);

             button.addEventListener('click', function (e) {
                 editor.s.insertHTML(prompt("Enter your code"));
                 return false;
             });
             return div;
         }
     }
   ]
});

Type declarationType declaration

(jodit, current, close, button): string | false | HTMLElement | IUIElement

After click on the button it will show popup element which consist value that this function returned

ParametersParameters

ReturnsReturns

string | false | HTMLElement | IUIElement

Example

var editor = Jodit.make('.editor', {
   buttons: [
     {
         icon: "insertCode",
         popup: function (editor) {
             var div = document.createElement('div'), button = dccument.createElement('button');
             div.innerHTML = 'Hi! Click button and enter your code';
             button.innerHTML = 'Click me';

             div.appendChild(button);

             button.addEventListener('click', function (e) {
                 editor.s.insertHTML(prompt("Enter your code"));
                 return false;
             });
             return div;
         }
     }
   ]
});

Inherited fromInherited from

IControlTypeStrong.popup

Defined inDefined in

src/types/toolbar.d.ts#273

defaultValuedefaultValue

Optional defaultValue: string | string[]

Inherited fromInherited from

IControlTypeStrong.defaultValue

Defined inDefined in

src/types/toolbar.d.ts#280

valuevalue

Optional value: (jodit: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, button: IToolbarButton) => undefined | string

Type declarationType declaration

(jodit, button): undefined | string

ParametersParameters

ReturnsReturns

undefined | string

Inherited fromInherited from

IControlTypeStrong.value

Defined inDefined in

src/types/toolbar.d.ts#282

modsmods

Optional mods: IDictionary<ModType>

Inherited fromInherited from

IControlTypeStrong.mods

Defined inDefined in

src/types/toolbar.d.ts#283

namename

name: string

Inherited fromInherited from

IControlTypeStrong.name

Defined inDefined in

src/types/toolbar.d.ts#292

getContentgetContent

getContent: (editor: IViewBased<IViewOptions> | IJodit | IFileBrowser<IFileBrowserOptions>, button: IToolbarButton) => string | HTMLElement

Type declarationType declaration

(editor, button): string | HTMLElement

ParametersParameters

ReturnsReturns

string | HTMLElement

OverridesOverrides

IControlTypeStrong.getContent

Defined inDefined in

jodit/src/types/toolbar.d.ts:297