CKEDITOR.dialog.definition.select
The definition of a select element.
This class is not really part of the API. It just illustrates the properties that developers can use to define and create select elements.
Once the dialog is opened, the created element becomes a CKEDITOR.ui.dialog.select object and can be accessed with CKEDITOR.dialog.getContentElement.
For a complete example of dialog definition, please check CKEDITOR.dialog.add.
// There is no constructor for this class, the user just has to define an
// object with the appropriate properties.
// Example:
{
type: 'select',
id: 'sport',
label: 'Select your favourite sport',
items: [ [ 'Basketball' ], [ 'Baseball' ], [ 'Hockey' ], [ 'Football' ] ],
'default': 'Football',
onChange: function( api ) {
// this = CKEDITOR.ui.dialog.select
alert( 'Current value: ' + this.getValue() );
}
}
Filtering
Properties
-
align : String
CKEDITOR.dialog.definition.select#align
Horizontal alignment (in the container) of the UI element.
-
className : String
CKEDITOR.dialog.definition.select#className
CSS class names to append to the UI element.
-
commit : Function
CKEDITOR.dialog.definition.select#commit
Function to execute whenever the UI element's parent dialog's CKEDITOR.dialog.commitContent method is executed. It usually takes care of the respective UI element as a standalone element.
-
Specify the inline style of the input element container.
{ type: 'text', label: 'My Label', controlStyle: 'width: 3em' }
-
default : String
CKEDITOR.dialog.definition.select#default
The default value.
-
id : String
CKEDITOR.dialog.definition.select#id
The ID of the UI element.
-
Specify the inline style of the input element.
{ type: 'text', label: 'My Label', inputStyle: 'text-align: center' }
-
items : Array
CKEDITOR.dialog.definition.select#items
An array of options. Each option is a 1- or 2-item array of format
[ 'Description', 'Value' ]
. If'Value'
is missing, then the value would be assumed to be the same as the description. -
label : String
CKEDITOR.dialog.definition.select#label
-
labelLayout : String
CKEDITOR.dialog.definition.select#labelLayout
(Optional) Specify the layout of the label. Set to
'horizontal'
for horizontal layout. The default layout is vertical.{ type: 'text', label: 'My Label', labelLayout: 'horizontal' }
-
labelStyle : String
CKEDITOR.dialog.definition.select#labelStyle
Specify the inline style of the uiElement label.
{ type: 'text', label: 'My Label', labelStyle: 'color: red' }
-
multiple : Boolean
CKEDITOR.dialog.definition.select#multiple
(Optional) Set this to true if you'd like to have a multiple-choice select box.
Defaults to
false
-
onHide : Function
CKEDITOR.dialog.definition.select#onHide
Function to execute whenever the UI element's parent dialog is closed.
-
onLoad : Function
CKEDITOR.dialog.definition.select#onLoad
Function to execute the first time the UI element is displayed.
-
onShow : Function
CKEDITOR.dialog.definition.select#onShow
Function to execute whenever the UI element's parent dialog is displayed.
-
requiredContent : String | Object | style
CKEDITOR.dialog.definition.select#requiredContent
The content that needs to be allowed to enable this UI element. All formats accepted by CKEDITOR.filter.check may be used.
When all UI elements in a tab are disabled, this tab will be disabled automatically.
-
setup : Function
CKEDITOR.dialog.definition.select#setup
Function to execute whenever the UI element's parent dialog's CKEDITOR.dialog.setupContent method is executed. It usually takes care of the respective UI element as a standalone element.
-
size : Number
CKEDITOR.dialog.definition.select#size
(Optional) The number of items to display in the select box.
-
style : String
CKEDITOR.dialog.definition.select#style
Inline CSS classes to append to the UI element.
-
title : String
CKEDITOR.dialog.definition.select#title
The popup label of the UI element.
-
type : String
CKEDITOR.dialog.definition.select#type
The type of the UI element. Required.
-
validate : Function
CKEDITOR.dialog.definition.select#validate
(Optional) The validation function.
-
widths : Array
CKEDITOR.dialog.definition.select#widths
(Optional) Applies only to horizontal layouts: a two elements array of lengths to specify the widths of the label and the content element. See also labelLayout.
{ type: 'text', label: 'My Label', labelLayout: 'horizontal', widths: [100, 200] }