Package: | Ext.form |
Class: | HtmlEditor |
Extends: | Field |
Defined In: | HtmlEditor.js |
Property | Defined By | |
---|---|---|
buttonTips : Object | HtmlEditor | |
Object collection of toolbar tooltips for the buttons in the editor. The key is the command id associated with that b... | ||
disabled : Object | Component | |
true if this component is disabled. Read-only. | ||
hidden : Object | Component | |
true if this component is hidden. Read-only. | ||
rendered : Object | Component | |
true if this component has been rendered. Read-only. |
Method | Defined By | |
---|---|---|
addEvents( Object object ) : void |
Observable | |
Used to define events on this Observable | ||
addListener( String eventName , Function handler , [Object scope ], [Object options ] ) : void |
Observable | |
Appends an event handler to this component | ||
applyTo( String/HTMLElement/Element el ) : Ext.form.Field |
Field | |
Apply the behaviors of this component to an existing element. This is used instead of render(). | ||
cleanHtml( String html ) : void |
HtmlEditor | |
Protected method that will not generally be called directly. If you need/want custom HTML cleanup, this is the method... | ||
createToolbar( HtmlEditor editor ) : void |
HtmlEditor | |
Protected method that will not generally be called directly. It is called when the editor creates its toolbar. Overri... | ||
destroy() : void | Component | |
Destroys this component by purging any event listeners, removing the component's element from the DOM, removing the c... | ||
disable() : Ext.Component | Component | |
Disable this component. | ||
enable() : Ext.Component | Component | |
Enable this component. | ||
execCmd( String cmd , [String/Boolean value ] ) : void |
HtmlEditor | |
Executes a Midas editor command directly on the editor document. For visual commands, you should use relayCmd instead... | ||
fireEvent( String eventName , Object... args ) : Boolean |
Observable | |
Fires the specified event with the passed parameters (minus the event name). | ||
focus( Boolean selectText ) : Ext.Component |
Component | |
Try to focus this component. | ||
getBox( [Boolean local ] ) : s |
BoxComponent | |
Gets the current box measurements of the component's underlying element. | ||
getDocMarkup() : void | HtmlEditor | |
Protected method that will not generally be called directly. It is called when the editor initializes the iframe with... | ||
getEl() : Ext.Element | Component | |
Returns the underlying Ext.Element. | ||
getId() : String | Component | |
Returns the id of this component. | ||
getName() : String | Field | |
Returns the name attribute of the field if available | ||
getPosition( [Boolean local ] ) : Array |
BoxComponent | |
Gets the current XY position of the component's underlying element. | ||
getRawValue() : Mixed | Field | |
Returns the raw data value which may or may not be a valid, defined value. To return a normalized value see getValue. | ||
getSize() : Object | BoxComponent | |
Gets the current size of the component's underlying element. | ||
getToolbar() : Ext.Toolbar | HtmlEditor | |
Returns the editor's toolbar. This is only available after the editor has been rendered. | ||
getValue() : Mixed | Field | |
Returns the normalized data value (undefined or emptyText will be returned as ''). To return the raw value see getRa... | ||
hasListener( String eventName ) : Boolean |
Observable | |
Checks to see if this object has any listeners for a specified event | ||
hide() : Ext.Component | Component | |
Hide this component. | ||
insertAtCursor( String text ) : void |
HtmlEditor | |
Inserts the passed text at the current cursor position. Note: the editor must be initialized and activated to insert ... | ||
isDirty() : void | Field | |
Returns true if this field has been changed since it was originally loaded and is not disabled. | ||
isValid( Boolean preventMark ) : Boolean |
Field | |
Returns whether or not the field value is currently valid | ||
isVisible() : void | Component | |
Returns true if this component is visible. | ||
on( String eventName , Function handler , [Object scope ], [Object options ] ) : void |
Observable | |
Appends an event handler to this element (shorthand for addListener) | ||
onPosition( Number x , Number y ) : void |
BoxComponent | |
Called after the component is moved, this method is empty by default but can be implemented by any subclass that need... | ||
onResize( Number adjWidth , Number adjHeight , Number rawWidth , Number rawHeight ) : void |
BoxComponent | |
Called after the component is resized, this method is empty by default but can be implemented by any subclass that ne... | ||
purgeListeners() : void | Observable | |
Removes all listeners for this object | ||
pushValue() : void | HtmlEditor | |
Protected method that will not generally be called directly. Pushes the value of the textarea into the iframe editor. | ||
relayCmd( String cmd , [String/Boolean value ] ) : void |
HtmlEditor | |
Executes a Midas editor command on the editor document and performs necessary focus and toolbar updates. This should ... | ||
removeListener( String eventName , Function handler , [Object scope ] ) : void |
Observable | |
Removes a listener | ||
render( [String/HTMLElement/Element container ] ) : void |
Component | |
If this is a lazy rendering component, render it to its container element. | ||
reset() : void | Field | |
Resets the current field value to the originally loaded value and clears any validation messages | ||
setDisabled( Boolean disabled ) : void |
Component | |
Convenience function for setting disabled/enabled by boolean. | ||
setPagePosition( Number x , Number y ) : s |
BoxComponent | |
Sets the page XY position of the component. To set the left and top instead, use setPosition. This method fires the ... | ||
setPosition( Number left , Number top ) : s |
BoxComponent | |
Sets the left and top of the component. To set the page XY position instead, use setPagePosition. This method fires ... | ||
setRawValue( Mixed value ) : void |
Field | |
Sets the underlying DOM field's value directly, bypassing validation. To set the value with validation see setValue. | ||
setSize( Number/Object width , Number height ) : Ext.BoxComponent |
BoxComponent | |
Sets the width and height of the component. This method fires the resize event. This method can accept either width... | ||
setValue( Mixed value ) : void |
Field | |
Sets a data value into the field and validates it. To set the value directly without validation see setRawValue. | ||
setVisible( Boolean visible ) : Ext.Component |
Component | |
Convenience function to hide or show this component by boolean. | ||
show() : Ext.Component | Component | |
Show this component. | ||
syncSize() : s | BoxComponent | |
Force the component's size to recalculate based on the underlying element's current height and width. | ||
syncValue() : void | HtmlEditor | |
Protected method that will not generally be called directly. Syncs the contents of the editor iframe with the textarea. | ||
toggleSourceEdit( [Boolean sourceEdit ] ) : void |
HtmlEditor | |
Toggles the editor between standard and source edit mode. | ||
un( String eventName , Function handler , [Object scope ] ) : void |
Observable | |
Removes a listener (shorthand for removeListener) | ||
updateBox( Object box ) : s |
BoxComponent | |
Sets the current box measurements of the component's underlying element. | ||
updateToolbar() : void | HtmlEditor | |
Protected method that will not generally be called directly. It triggers a toolbar update by reading the markup state... | ||
validate() : Boolean | Field | |
Validates the field value |
Event | Defined By | |
---|---|---|
activate : ( HtmlEditor this ) |
HtmlEditor | |
Fires when the editor is first receives the focus. Any insertion must wait until after this event. | ||
beforedestroy : ( Ext.Component this ) |
Component | |
Fires before the component is destroyed. Return false to stop the destroy. | ||
beforehide : ( Ext.Component this ) |
Component | |
Fires before the component is hidden. Return false to stop the hide. | ||
beforepush : ( HtmlEditor this , String html ) |
HtmlEditor | |
Fires before the iframe editor is updated with content from the textarea. Return false to cancel the push. | ||
beforerender : ( Ext.Component this ) |
Component | |
Fires before the component is rendered. Return false to stop the render. | ||
beforeshow : ( Ext.Component this ) |
Component | |
Fires before the component is shown. Return false to stop the show. | ||
beforesync : ( HtmlEditor this , String html ) |
HtmlEditor | |
Fires before the textarea is updated with content from the editor iframe. Return false to cancel the sync. | ||
destroy : ( Ext.Component this ) |
Component | |
Fires after the component is destroyed. | ||
disable : ( Ext.Component this ) |
Component | |
Fires after the component is disabled. | ||
editmodechange : ( HtmlEditor this , Boolean sourceEdit ) |
HtmlEditor | |
Fires when the editor switches edit modes | ||
enable : ( Ext.Component this ) |
Component | |
Fires after the component is enabled. | ||
hide : ( Ext.Component this ) |
Component | |
Fires after the component is hidden. | ||
initialize : ( HtmlEditor this ) |
HtmlEditor | |
Fires when the editor is fully initialized (including the iframe) | ||
invalid : ( Ext.form.Field this , String msg ) |
Field | |
Fires after the field has been marked as invalid. | ||
move : ( Ext.Component this , Number x , Number y ) |
BoxComponent | |
Fires after the component is moved. | ||
push : ( HtmlEditor this , String html ) |
HtmlEditor | |
Fires when the iframe editor is updated with content from the textarea. | ||
render : ( Ext.Component this ) |
Component | |
Fires after the component is rendered. | ||
resize : ( Ext.Component this , Number adjWidth , Number adjHeight , Number rawWidth , Number rawHeight ) |
BoxComponent | |
Fires after the component is resized. | ||
show : ( Ext.Component this ) |
Component | |
Fires after the component is shown. | ||
sync : ( HtmlEditor this , String html ) |
HtmlEditor | |
Fires when the textarea is updated with content from the editor iframe. | ||
valid : ( Ext.form.Field this ) |
Field | |
Fires after the field has been validated with no errors. |
Config Options | Defined By | |
---|---|---|
allowDomMove : Boolean | Component | |
Whether the component can move the Dom node when rendering (defaults to true). | ||
cls : String | Field | |
A CSS class to apply to the field's underlying element. | ||
createLinkText : String | HtmlEditor | |
The default text for the create link prompt | ||
defaultLinkValue : String | HtmlEditor | |
The default value for the create link prompt (defaults to http:/ /) | ||
disableClass : String | Component | |
CSS class added to the component when it is disabled (defaults to "x-item-disabled"). | ||
disabled : Boolean | Field | |
True to disable the field (defaults to false). | ||
enableAlignments : Boolean | HtmlEditor | |
Enable the left, center, right alignment buttons (defaults to true) | ||
enableColors : Boolean | HtmlEditor | |
Enable the fore/highlight color buttons (defaults to true) | ||
enableFont : Boolean | HtmlEditor | |
Enable font selection. Not available in Safari. (defaults to true) | ||
enableFontSize : Boolean | HtmlEditor | |
Enable the increase/decrease font size buttons (defaults to true) | ||
enableFormat : Boolean | HtmlEditor | |
Enable the bold, italic and underline buttons (defaults to true) | ||
enableLinks : Boolean | HtmlEditor | |
Enable the create link button. Not available in Safari. (defaults to true) | ||
enableLists : Boolean | HtmlEditor | |
Enable the bullet and numbered list buttons. Not available in Safari. (defaults to true) | ||
enableSourceEdit : Boolean | HtmlEditor | |
Enable the switch to source edit button. Not available in Safari. (defaults to true) | ||
fontFamilies : Array | HtmlEditor | |
An array of available font families | ||
hideMode : String | Component | |
How this component should hidden. Supported values are "visibility" (css visibility), "offsets" (negative offset posi... | ||
msgTarget : String | Field | |
The location where error text should display. Should be one of the following values (defaults to 'qtip'): Value ... | ||
name : String | Field | |
The field's HTML name attribute. | ||
readOnly : Boolean | Field | |
True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM att... | ||
tabIndex : Number | Field | |
The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyT... | ||
validationDelay : Number | Field | |
The length of time in milliseconds after user input begins until validation is initiated (defaults to 250) | ||
validationEvent : String/Boolean | Field | |
The event that should initiate field validation. Set to false to disable automatic validation (defaults to "keyup"). | ||
value : Mixed | Field | |
A value to initialize this field with. |
public Object buttonTips
{
bold : {
title: 'Bold (Ctrl+B)',
text: 'Make the selected text bold.',
cls: 'x-html-editor-tip'
},
italic : {
title: 'Italic (Ctrl+I)',
text: 'Make the selected text italic.',
cls: 'x-html-editor-tip'
},
...
public Object disabled
public Object hidden
public Object rendered
public function addEvents( Object object
)
object
: Objectvoid
public function addListener( String eventName
, Function handler
, [Object scope
], [Object options
] )
eventName
: Stringhandler
: Functionscope
: Objectoptions
: Object
Combining Options
Using the options argument, it is possible to combine different types of listeners:
A normalized, delayed, one-time listener that auto stops the event and passes a custom argument (forumId)
el.on('click', this.onClick, this, {
single: true,
delay: 100,
forumId: 4
});
Attaching multiple handlers in 1 call
The method also allows for a single argument to be passed which is a config object containing properties
which specify multiple handlers.
el.on({
'click': {
fn: this.onClick,
scope: this,
delay: 100
},
'mouseover': {
fn: this.onMouseOver,
scope: this
},
'mouseout': {
fn: this.onMouseOut,
scope: this
}
});
Or a shorthand syntax which passes the same scope object to all handlers:
el.on({
'click': this.onClick,
'mouseover': this.onMouseOver,
'mouseout': this.onMouseOut,
scope: this
});
void
public function applyTo( String/HTMLElement/Element el
)
el
: String/HTMLElement/ElementExt.form.Field
public function cleanHtml( String html
)
html
: Stringvoid
public function createToolbar( HtmlEditor editor
)
editor
: HtmlEditorvoid
public function destroy()
void
public function disable()
Ext.Component
public function enable()
Ext.Component
public function execCmd( String cmd
, [String/Boolean value
] )
cmd
: Stringvalue
: String/Booleanvoid
public function fireEvent( String eventName
, Object... args
)
eventName
: Stringargs
: Object...Boolean
public function focus( Boolean selectText
)
selectText
: BooleanExt.Component
public function getBox( [Boolean local
] )
local
: Booleans
public function getDocMarkup()
void
public function getEl()
Ext.Element
public function getId()
String
public function getName()
String
public function getPosition( [Boolean local
] )
local
: BooleanArray
public function getRawValue()
Mixed
public function getSize()
Object
public function getToolbar()
Ext.Toolbar
public function getValue()
Mixed
public function hasListener( String eventName
)
eventName
: StringBoolean
public function hide()
Ext.Component
public function insertAtCursor( String text
)
text
: Stringvoid
public function isDirty()
void
public function isValid( Boolean preventMark
)
preventMark
: BooleanBoolean
public function isVisible()
void
public function on( String eventName
, Function handler
, [Object scope
], [Object options
] )
eventName
: Stringhandler
: Functionscope
: Objectoptions
: Objectvoid
public function onPosition( Number x
, Number y
)
x
: Numbery
: Numbervoid
public function onResize( Number adjWidth
, Number adjHeight
, Number rawWidth
, Number rawHeight
)
adjWidth
: NumberadjHeight
: NumberrawWidth
: NumberrawHeight
: Numbervoid
public function purgeListeners()
void
public function pushValue()
void
public function relayCmd( String cmd
, [String/Boolean value
] )
cmd
: Stringvalue
: String/Booleanvoid
public function removeListener( String eventName
, Function handler
, [Object scope
] )
eventName
: Stringhandler
: Functionscope
: Objectvoid
public function render( [String/HTMLElement/Element container
] )
container
: String/HTMLElement/Elementvoid
public function reset()
void
public function setDisabled( Boolean disabled
)
disabled
: Booleanvoid
public function setPagePosition( Number x
, Number y
)
x
: Numbery
: Numbers
public function setPosition( Number left
, Number top
)
left
: Numbertop
: Numbers
public function setRawValue( Mixed value
)
value
: Mixedvoid
public function setSize( Number/Object width
, Number height
)
width
: Number/Objectheight
: NumberExt.BoxComponent
public function setValue( Mixed value
)
value
: Mixedvoid
public function setVisible( Boolean visible
)
visible
: BooleanExt.Component
public function show()
Ext.Component
public function syncSize()
s
public function syncValue()
void
public function toggleSourceEdit( [Boolean sourceEdit
] )
sourceEdit
: Booleanvoid
public function un( String eventName
, Function handler
, [Object scope
] )
eventName
: Stringhandler
: Functionscope
: Objectvoid
public function updateBox( Object box
)
box
: Objects
public function updateToolbar()
void
public function validate()
Boolean
public event activate
this
: HtmlEditorpublic event beforedestroy
this
: Ext.Componentpublic event beforehide
this
: Ext.Componentpublic event beforepush
this
: HtmlEditorhtml
: Stringpublic event beforerender
this
: Ext.Componentpublic event beforeshow
this
: Ext.Componentpublic event beforesync
this
: HtmlEditorhtml
: Stringpublic event destroy
this
: Ext.Componentpublic event disable
this
: Ext.Componentpublic event editmodechange
this
: HtmlEditorsourceEdit
: Booleanpublic event enable
this
: Ext.Componentpublic event hide
this
: Ext.Componentpublic event initialize
this
: HtmlEditorpublic event invalid
this
: Ext.form.Fieldmsg
: Stringpublic event move
this
: Ext.Componentx
: Numbery
: Numberpublic event push
this
: HtmlEditorhtml
: Stringpublic event render
this
: Ext.Componentpublic event resize
this
: Ext.ComponentadjWidth
: NumberadjHeight
: NumberrawWidth
: NumberrawHeight
: Numberpublic event show
this
: Ext.Componentpublic event sync
this
: HtmlEditorhtml
: Stringpublic event valid
this
: Ext.form.FieldallowDomMove : Boolean
cls : String
createLinkText : String
defaultLinkValue : String
disableClass : String
disabled : Boolean
enableAlignments : Boolean
enableColors : Boolean
enableFont : Boolean
enableFontSize : Boolean
enableFormat : Boolean
enableLinks : Boolean
enableLists : Boolean
enableSourceEdit : Boolean
fontFamilies : Array
hideMode : String
msgTarget : String
Value Description ----------- ---------------------------------------------------------------------- qtip Display a quick tip when the user hovers over the field title Display a default browser title attribute popup under Add a block div beneath the field containing the error text side Add an error icon to the right of the field with a popup on hover [element id] Add the error text directly to the innerHTML of the specified element
readOnly : Boolean
tabIndex : Number
validationDelay : Number
validationEvent : String/Boolean