Class CKEDITOR.dialog
Defined in: plugins/dialog/plugin.js.
Constructor Attributes | Constructor Name and Description |
---|---|
CKEDITOR.dialog(editor, dialogName)
This is the base class for runtime dialog objects.
|
Field Attributes | Field Name and Description |
---|---|
<static> |
CKEDITOR.dialog.cancelButton
The default cancel button for dialogs.
|
<static> |
CKEDITOR.dialog.okButton
The default OK button for dialogs.
|
Resets all input values in the dialog.
|
Method Attributes | Method Name and Description |
---|---|
<static> |
CKEDITOR.dialog.add(name, dialogDefinition)
Registers a dialog.
|
<static> |
CKEDITOR.dialog.addIframe(name, title, minWidth, minHeight, onContentLoad, userDefinition, userDefinition)
An iframe base dialog.
|
<static> |
CKEDITOR.dialog.addUIElement(typeName, builder)
Registers a dialog UI element.
|
<static> |
CKEDITOR.dialog.exists(name)
|
<static> |
CKEDITOR.dialog.getCurrent()
|
addFocusable(element, index)
Adds element to dialog's focusable list.
|
|
addPage(contents)
Adds a tabbed page into the dialog.
|
|
click(id)
Simulates a click to a dialog button in the dialog's button row.
|
|
Calls the CKEDITOR.dialog.definition.uiElement#commit method of each of the UI elements, with the arguments passed through it.
|
|
destroy()
|
|
disableButton(id)
Disables a dialog button.
|
|
enableButton(id)
Enables a dialog button.
|
|
foreach(fn)
Executes a function for each UI element.
|
|
getButton(id)
Gets the UI element of a button in the dialog's button row.
|
|
getContentElement(pageId, elementId)
Gets a dialog UI element object from a dialog page.
|
|
Gets the root DOM element of the dialog.
|
|
getName()
Gets the name of the dialog.
|
|
Gets the number of pages in the dialog.
|
|
Gets the editor instance which opened this dialog.
|
|
Gets the dialog's position in the window.
|
|
Gets the element that was selected when opening the dialog, if any.
|
|
getSize()
Gets the current size of the dialog in pixels.
|
|
getValueOf(pageId, elementId)
Gets the value of a dialog UI element.
|
|
hide()
Hides the dialog box.
|
|
hidePage(id)
Hides a page's tab away from the dialog.
|
|
layout()
Rearrange the dialog to its previous position or the middle of the window.
|
|
move(x, y, save)
Moves the dialog to an (x, y) coordinate relative to the window.
|
|
resize(width, height)
Resizes the dialog.
|
|
selectPage(id)
Activates a tab page in the dialog by its id.
|
|
Calls the CKEDITOR.dialog.definition.uiElement#setup method of each of the UI elements, with the arguments passed through it.
|
|
setValueOf(pageId, elementId, value)
Sets the value of a dialog UI element.
|
|
show()
Shows the dialog box.
|
|
showPage(id)
Unhides a page's tab.
|
|
Event Attributes | Event Name and Description |
---|---|
Fired when the user tries to dismiss a dialog
|
|
Fired when a dialog is hidden
|
|
Fired when the user tries to confirm a dialog
|
|
Fired when a dialog is being resized.
|
|
Fired when a tab is going to be selected in a dialog
|
|
Fired when a dialog is shown
|
Class Detail
CKEDITOR.dialog(editor, dialogName)
Since:
3.0
This is the base class for runtime dialog objects. An instance of this
class represents a single named dialog for a single editor instance.
var dialogObj = new CKEDITOR.dialog( editor, 'smiley' );
- Parameters:
- {Object} editor
- The editor which created the dialog.
- {String} dialogName
- The dialog's registered name.
Field Detail
<static>
{Function}
CKEDITOR.dialog.cancelButton
Since:
3.0
The default cancel button for dialogs. Fires the "cancel" event and closes the dialog if no UI element value changed.
<static>
{Function}
CKEDITOR.dialog.okButton
Since:
3.0
The default OK button for dialogs. Fires the "ok" event and closes the dialog if the event succeeds.
{CKEDITOR.dialog}
reset
Since:
3.0
Resets all input values in the dialog.
dialogObj.reset();
Method Detail
<static>
{Undefined}
CKEDITOR.dialog.add(name, dialogDefinition)
Since:
3.0
Registers a dialog.
// Full sample plugin, which does not only register a dialog window but also adds an item to the context menu. // To open the dialog window, choose "Open dialog" in the context menu. CKEDITOR.plugins.add( 'myplugin', { init: function( editor ) { editor.addCommand( 'mydialog',new CKEDITOR.dialogCommand( 'mydialog' ) ); if ( editor.contextMenu ) { editor.addMenuGroup( 'mygroup', 10 ); editor.addMenuItem( 'My Dialog', { label : 'Open dialog', command : 'mydialog', group : 'mygroup' }); editor.contextMenu.addListener( function( element ) { return { 'My Dialog' : CKEDITOR.TRISTATE_OFF }; }); } CKEDITOR.dialog.add( 'mydialog', function( api ) { // CKEDITOR.dialog.definition var dialogDefinition = { title : 'Sample dialog', minWidth : 390, minHeight : 130, contents : [ { id : 'tab1', label : 'Label', title : 'Title', expand : true, padding : 0, elements : [ { type : 'html', html : '<p>This is some sample HTML content.</p>' }, { type : 'textarea', id : 'textareaId', rows : 4, cols : 40 } ] } ], buttons : [ CKEDITOR.dialog.okButton, CKEDITOR.dialog.cancelButton ], onOk : function() { // "this" is now a CKEDITOR.dialog object. // Accessing dialog elements: var textareaObj = this.getContentElement( 'tab1', 'textareaId' ); alert( "You have entered: " + textareaObj.getValue() ); } }; return dialogDefinition; } ); } } ); CKEDITOR.replace( 'editor1', { extraPlugins : 'myplugin' } );
- Parameters:
- {String} name
- The dialog's name.
- {Function|String} dialogDefinition
- A function returning the dialog's definition, or the URL to the .js file holding the function. The function should accept an argument "editor" which is the current editor instance, and return an object conforming to CKEDITOR.dialog.definition.
<static>
{Undefined}
CKEDITOR.dialog.addIframe(name, title, minWidth, minHeight, onContentLoad, userDefinition, userDefinition)
Since:
3.0
An iframe base dialog.
Defined in: plugins/iframedialog/plugin.js.
Defined in: plugins/iframedialog/plugin.js.
- Parameters:
- {String} name
- Name of the dialog
- {String} title
- Title of the dialog
- {Number} minWidth
- Minimum width of the dialog
- {Number} minHeight
- Minimum height of the dialog
- {Function} onContentLoad Optional
- Function called when the iframe has been loaded. If it isn't specified, the inner frame is notified of the dialog events ('load', 'resize', 'ok' and 'cancel') on a function called 'onDialogEvent'
- {Object} userDefinition Optional
- Additional properties for the dialog definition
- {Undefined} userDefinition
<static>
{Undefined}
CKEDITOR.dialog.addUIElement(typeName, builder)
Since:
3.0
Registers a dialog UI element.
- Parameters:
- {String} typeName
- The name of the UI element.
- {Function} builder
- The function to build the UI element.
<static>
{Undefined}
CKEDITOR.dialog.exists(name)
Since:
3.0
NO EXAMPLE AVAILABLE
- Parameters:
- {Undefined} name
<static>
{Undefined}
CKEDITOR.dialog.getCurrent()
Since:
3.0
NO EXAMPLE AVAILABLE
{Undefined}
addFocusable(element, index)
Since:
3.0
Adds element to dialog's focusable list.
NO EXAMPLE AVAILABLE
- Parameters:
- {CKEDITOR.dom.element} element
- {Number} index Optional
{Undefined}
addPage(contents)
Since:
3.0
Adds a tabbed page into the dialog.
- Parameters:
- {Object} contents
- Content definition.
{Undefined}
click(id)
Since:
3.0
Simulates a click to a dialog button in the dialog's button row.
- Parameters:
- {String} id
- The id of the button.
- Returns:
- {Undefined} The return value of the dialog's "click" event.
{Undefined}
commitContent()
Since:
3.0
Calls the CKEDITOR.dialog.definition.uiElement#commit method of each of the UI elements, with the arguments passed through it.
It is usually being called when the user confirms the dialog, to process the values.
dialogObj.commitContent();
var timestamp = ( new Date() ).valueOf(); dialogObj.commitContent( timestamp );
{Undefined}
destroy()
Since:
3.0
NO EXAMPLE AVAILABLE
{Undefined}
disableButton(id)
Since:
3.0
Disables a dialog button.
- Parameters:
- {String} id
- The id of the button.
{Undefined}
enableButton(id)
Since:
3.0
Enables a dialog button.
- Parameters:
- {String} id
- The id of the button.
{CKEDITOR.dialog}
foreach(fn)
Since:
3.0
Executes a function for each UI element.
NO EXAMPLE AVAILABLE
- Parameters:
- {Function} fn
- Function to execute for each UI element.
- Returns:
- {CKEDITOR.dialog} The current dialog object.
{CKEDITOR.ui.dialog.button}
getButton(id)
Since:
3.0
Gets the UI element of a button in the dialog's button row.
- Parameters:
- {String} id
- The id of the button.
- Returns:
- {CKEDITOR.ui.dialog.button} The button object.
{CKEDITOR.ui.dialog.uiElement}
getContentElement(pageId, elementId)
Since:
3.0
Gets a dialog UI element object from a dialog page.
dialogObj.getContentElement( 'tabId', 'elementId' ).setValue( 'Example' );
- Parameters:
- {String} pageId
- id of dialog page.
- {String} elementId
- id of UI element.
- Returns:
- {CKEDITOR.ui.dialog.uiElement} The dialog UI element.
{CKEDITOR.dom.element}
getElement()
Since:
3.0
Gets the root DOM element of the dialog.
var dialogElement = dialogObj.getElement().getFirst(); dialogElement.setStyle( 'padding', '5px' );
- Returns:
- {CKEDITOR.dom.element} The <span> element containing this dialog.
{String}
getName()
Since:
3.0
Gets the name of the dialog.
var dialogName = dialogObj.getName();
- Returns:
- {String} The name of this dialog.
{Number}
getPageCount()
Since:
3.0
Gets the number of pages in the dialog.
NO EXAMPLE AVAILABLE
- Returns:
- {Number} Page count.
{CKEDITOR.editor}
getParentEditor()
Since:
3.0
Gets the editor instance which opened this dialog.
NO EXAMPLE AVAILABLE
- Returns:
- {CKEDITOR.editor} Parent editor instances.
{Object}
getPosition()
Since:
3.0
Gets the dialog's position in the window.
var dialogX = dialogObj.getPosition().x;
- Returns:
- {Object} An object with "x" and "y" properties.
{CKEDITOR.dom.element}
getSelectedElement()
Since:
3.0
Gets the element that was selected when opening the dialog, if any.
NO EXAMPLE AVAILABLE
- Returns:
- {CKEDITOR.dom.element} The element that was selected, or null.
{Object}
getSize()
Since:
3.0
Gets the current size of the dialog in pixels.
var width = dialogObj.getSize().width;
- Returns:
- {Object} An object with "width" and "height" properties.
{Object}
getValueOf(pageId, elementId)
Since:
3.0
Gets the value of a dialog UI element.
alert( dialogObj.getValueOf( 'tabId', 'elementId' ) );
- Parameters:
- {String} pageId
- id of dialog page.
- {String} elementId
- id of UI element.
- Returns:
- {Object} The value of the UI element.
{Undefined}
hide()
Since:
3.0
Hides the dialog box.
dialogObj.hide();
{Undefined}
hidePage(id)
Since:
3.0
Hides a page's tab away from the dialog.
dialog.hidePage( 'tab_3' );
- Parameters:
- {String} id
- The page's Id.
{Undefined}
layout()
Since:
3.5
Rearrange the dialog to its previous position or the middle of the window.
NO EXAMPLE AVAILABLE
{Undefined}
move(x, y, save)
Since:
3.0
Moves the dialog to an (x, y) coordinate relative to the window.
dialogObj.move( 10, 40 );
- Parameters:
- {Number} x
- The target x-coordinate.
- {Number} y
- The target y-coordinate.
- {Boolean} save
- Flag indicate whether the dialog position should be remembered on next open up.
{Undefined}
resize(width, height)
Since:
3.0
Resizes the dialog.
dialogObj.resize( 800, 640 );
- Parameters:
- {Number} width
- The width of the dialog in pixels.
- {Number} height
- The height of the dialog in pixels.
{Undefined}
selectPage(id)
Since:
3.0
Activates a tab page in the dialog by its id.
dialogObj.selectPage( 'tab_1' );
- Parameters:
- {String} id
- The id of the dialog tab to be activated.
{Undefined}
setupContent()
Since:
3.0
Calls the CKEDITOR.dialog.definition.uiElement#setup method of each of the UI elements, with the arguments passed through it.
It is usually being called when the dialog is opened, to put the initial value inside the field.
dialogObj.setupContent();
var timestamp = ( new Date() ).valueOf(); dialogObj.setupContent( timestamp );
{Undefined}
setValueOf(pageId, elementId, value)
Since:
3.0
Sets the value of a dialog UI element.
dialogObj.setValueOf( 'tabId', 'elementId', 'Example' );
- Parameters:
- {String} pageId
- id of the dialog page.
- {String} elementId
- id of the UI element.
- {Object} value
- The new value of the UI element.
{Undefined}
show()
Since:
3.0
Shows the dialog box.
dialogObj.show();
{Undefined}
showPage(id)
Since:
3.0
Unhides a page's tab.
dialog.showPage( 'tab_2' );
- Parameters:
- {String} id
- The page's Id.
{Undefined}
updateStyle()
Since:
3.0
NO EXAMPLE AVAILABLE
Event Detail
cancel : <object>.on( 'cancel', function( e ){ ... } )
Since:
3.0
Fired when the user tries to dismiss a dialog
NO EXAMPLE AVAILABLE
- Parameters:
- {CKEDITOR.eventInfo} e
- The standard event object passed to event listeners.
- {Boolean} e.hide
- Whether the event should proceed or not.
hide : <object>.on( 'hide', function( e ){ ... } )
Since:
3.0
Fired when a dialog is hidden
NO EXAMPLE AVAILABLE
- Parameters:
- {CKEDITOR.eventInfo} e
- The standard event object passed to event listeners.
ok : <object>.on( 'ok', function( e ){ ... } )
Since:
3.0
Fired when the user tries to confirm a dialog
NO EXAMPLE AVAILABLE
- Parameters:
- {CKEDITOR.eventInfo} e
- The standard event object passed to event listeners.
- {Boolean} e.hide
- Whether the event should proceed or not.
resize : <object>.on( 'resize', function( e ){ ... } )
Since:
3.5
Fired when a dialog is being resized. The event is fired on
both the 'CKEDITOR.dialog' object and the dialog instance
since 3.5.3, previously it's available only in the global object.
NO EXAMPLE AVAILABLE
- Parameters:
- {CKEDITOR.eventInfo} e
- The standard event object passed to event listeners.
- {CKEDITOR.dialog} e.dialog
- The dialog being resized (if it's fired on the dialog itself, this parameter isn't sent).
- {String} e.skin
- The skin name.
- {Number} e.width
- The new width.
- {Number} e.height
- The new height.
selectPage : <object>.on( 'selectPage', function( e ){ ... } )
Since:
3.0
Fired when a tab is going to be selected in a dialog
NO EXAMPLE AVAILABLE
- Parameters:
- {CKEDITOR.eventInfo} e
- The standard event object passed to event listeners.
- {String} e.page
- The id of the page that it's gonna be selected.
- {String} e.currentPage
- The id of the current page.
show : <object>.on( 'show', function( e ){ ... } )
Since:
3.0
Fired when a dialog is shown
NO EXAMPLE AVAILABLE
- Parameters:
- {CKEDITOR.eventInfo} e
- The standard event object passed to event listeners.