A base editor field that handles displaying/hiding on demand and has some built-in sizing and event handling logic.
|
Editor( @link Ext.form.Field} , Object config ) |
Editor |
Create a new Editor |
|
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 |
|
cancelEdit( Boolean remainVisible ) : void |
Editor |
Cancels the editing process and hides the editor without persisting any changes. The field value will be
reverted to... |
|
completeEdit( Boolean remainVisible ) : void |
Editor |
Ends the editing process, persists the changed value to the underlying field, and hides the editor. |
|
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. |
|
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. |
|
getEl() : Ext.Element |
Component |
Returns the underlying Ext.Element. |
|
getId() : String |
Component |
Returns the id of this component. |
|
getValue() : Mixed |
Editor |
Gets the data value of the editor |
|
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. |
|
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) |
|
purgeListeners() : void |
Observable |
Removes all listeners for this object |
|
realign() : void |
Editor |
Realigns the editor to the bound field based on the current alignment config value. |
|
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. |
|
setDisabled( Boolean disabled ) : void |
Component |
Convenience function for setting disabled/enabled by boolean. |
|
setSize( Number width , Number height ) : void |
Editor |
Sets the height and width of this editor. |
|
setValue( Mixed value ) : void |
Editor |
Sets the data value of the editor |
|
setVisible( Boolean visible ) : Ext.Component |
Component |
Convenience function to hide or show this component by boolean. |
|
show() : Ext.Component |
Component |
Show this component. |
|
startEdit( String/HTMLElement/Element el , [String value ] ) : void |
Editor |
Starts the editing process and shows the editor. |
|
un( String eventName , Function handler , [Object scope ] ) : void |
Observable |
Removes a listener (shorthand for removeListener) |
|
beforecomplete : ( Editor this , Mixed value , Mixed startValue ) |
Editor |
Fires after a change has been made to the field, but before the change is reflected in the underlying
field. Saving ... |
|
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. |
|
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. |
|
beforestartedit : ( Editor this , Ext.Element boundEl , Mixed value ) |
Editor |
Fires when editing is initiated, but before the value changes. Editing can be canceled by returning
false from the h... |
|
complete : ( Editor this , Mixed value , Mixed startValue ) |
Editor |
Fires after editing is complete and any changed value has been written to the underlying field. |
|
destroy : ( Ext.Component this ) |
Component |
Fires after the component is destroyed. |
|
disable : ( Ext.Component this ) |
Component |
Fires after the component is disabled. |
|
enable : ( Ext.Component this ) |
Component |
Fires after the component is enabled. |
|
hide : ( Ext.Component this ) |
Component |
Fires after the component is hidden. |
|
render : ( Ext.Component this ) |
Component |
Fires after the component is rendered. |
|
show : ( Ext.Component this ) |
Component |
Fires after the component is shown. |
|
specialkey : ( Ext.form.Field this , Ext.EventObject e ) |
Editor |
Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed. You can check
Ext.EventObject.g... |
|
startedit : ( Ext.Element boundEl , Mixed value ) |
Editor |
Fires when this editor is displayed |
|
alignment : String |
Editor |
The position to align to (see Ext.Element.alignTo for more details, defaults to "c-c?"). |
|
allowDomMove : Boolean |
Component |
Whether the component can move the Dom node when rendering (defaults to true). |
|
autosize : Boolean/String |
Editor |
True for the editor to automatically adopt the size of the underlying field, "width" to adopt the width only, or "hei... |
|
cancelOnEsc : Boolean |
Editor |
True to cancel the edit when the escape key is pressed (defaults to false) |
|
completeOnEnter : Boolean |
Editor |
True to complete the edit when the enter key is pressed (defaults to false) |
|
constrain : Boolean |
Editor |
True to constrain the editor to the viewport |
|
disableClass : String |
Component |
CSS class added to the component when it is disabled (defaults to "x-item-disabled"). |
|
hideEl : Boolean |
Editor |
False to keep the bound element visible while the editor is displayed (defaults to true) |
|
hideMode : String |
Component |
How this component should hidden. Supported values are "visibility" (css visibility), "offsets" (negative offset posi... |
|
ignoreNoChange : Boolean |
Editor |
True to skip the the edit completion process (no save, no events fired) if the user completes an edit and the value h... |
|
revertInvalid : Boolean |
Editor |
True to automatically revert the field value and cancel the edit when the user completes an edit and the field valida... |
|
shadow : Boolean/String |
Editor |
"sides" for sides/bottom only, "frame" for 4-way shadow, and "drop" for bottom-right shadow (defaults to "frame") |
|
updateEl : Boolean |
Editor |
True to update the innerHTML of the bound element when the update completes (defaults to false) |
|
value : Mixed |
Editor |
The data value of the underlying field (defaults to "") |
addEvents
public function addEvents( Object object
)
Used to define events on this Observable
addListener
public function addListener( String eventName
, Function handler
, [Object scope
], [Object options
] )
Appends an event handler to this component
Parameters:
eventName
: StringThe type of event to listen for
handler
: FunctionThe method the event invokes
scope
: Object(optional) The scope in which to execute the handler
function. The handler function's "this" context.
options
: Object(optional) An object containing handler configuration
properties. This may contain any of the following properties:
- scope {Object} The scope in which to execute the handler function. The handler function's "this" context.
- delay {Number} The number of milliseconds to delay the invocation of the handler after te event fires.
- single {Boolean} True to add a handler to handle just the next firing of the event, and then remove itself.
- buffer {Number} Causes the handler to be scheduled to run in an Ext.util.DelayedTask delayed
by the specified number of milliseconds. If the event fires again within that time, the original
handler is not invoked, but the new handler is scheduled in its place.
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
});
Returns:
cancelEdit
public function cancelEdit( Boolean remainVisible
)
Cancels the editing process and hides the editor without persisting any changes. The field value will be
reverted to the original starting value.
This method is defined by Editor.
completeEdit
public function completeEdit( Boolean remainVisible
)
Ends the editing process, persists the changed value to the underlying field, and hides the editor.
This method is defined by Editor.
destroy
public function destroy()
Destroys this component by purging any event listeners, removing the component's element from the DOM,
removing the component from its
Ext.Container (if applicable) and unregistering it from
Ext.ComponentMgr.
disable
public function disable()
enable
public function enable()
fireEvent
public function fireEvent( String eventName
, Object... args
)
Fires the specified event with the passed parameters (minus the event name).
focus
public function focus( Boolean selectText
)
Try to focus this component.
getEl
public function getEl()
getId
public function getId()
Returns the id of this component.
getValue
public function getValue()
Gets the data value of the editor
This method is defined by Editor.
hasListener
public function hasListener( String eventName
)
Checks to see if this object has any listeners for a specified event
hide
public function hide()
isVisible
public function isVisible()
Returns true if this component is visible.
on
public function on( String eventName
, Function handler
, [Object scope
], [Object options
] )
Appends an event handler to this element (shorthand for addListener)
Parameters:
eventName
: StringThe type of event to listen for
handler
: FunctionThe method the event invokes
scope
: Object(optional) The scope in which to execute the handler
function. The handler function's "this" context.
options
: Object(optional)
Returns:
purgeListeners
public function purgeListeners()
Removes all listeners for this object
realign
public function realign()
Realigns the editor to the bound field based on the current alignment config value.
This method is defined by Editor.
removeListener
public function removeListener( String eventName
, Function handler
, [Object scope
] )
render
public function render( [String/HTMLElement/Element container
] )
If this is a lazy rendering component, render it to its container element.
setDisabled
public function setDisabled( Boolean disabled
)
Convenience function for setting disabled/enabled by boolean.
setSize
public function setSize( Number width
, Number height
)
Sets the height and width of this editor.
Parameters:
width
: NumberThe new width
height
: NumberThe new height
Returns:
This method is defined by Editor.
setValue
public function setValue( Mixed value
)
Sets the data value of the editor
This method is defined by Editor.
setVisible
public function setVisible( Boolean visible
)
Convenience function to hide or show this component by boolean.
show
public function show()
startEdit
public function startEdit( String/HTMLElement/Element el
, [String value
] )
Starts the editing process and shows the editor.
This method is defined by Editor.
un
public function un( String eventName
, Function handler
, [Object scope
] )
Removes a listener (shorthand for removeListener)
beforecomplete
public event beforecomplete
Fires after a change has been made to the field, but before the change is reflected in the underlying
field. Saving the change to the field can be canceled by returning false from the handler of this event.
Note that if the value has not changed and ignoreNoChange = true, the editing will still end but this
event will not fire since no edit actually occurred.
Subscribers will be called with the following parameters:
this
: Editorvalue
: MixedThe current field value
startValue
: MixedThe original field value
This event is defined by Editor.
beforedestroy
public event beforedestroy
Fires before the component is destroyed. Return false to stop the destroy.
Subscribers will be called with the following parameters:
beforehide
public event beforehide
Fires before the component is hidden. Return false to stop the hide.
Subscribers will be called with the following parameters:
beforerender
public event beforerender
Fires before the component is rendered. Return false to stop the render.
Subscribers will be called with the following parameters:
beforeshow
public event beforeshow
Fires before the component is shown. Return false to stop the show.
Subscribers will be called with the following parameters:
beforestartedit
public event beforestartedit
Fires when editing is initiated, but before the value changes. Editing can be canceled by returning
false from the handler of this event.
Subscribers will be called with the following parameters:
This event is defined by Editor.
complete
public event complete
Fires after editing is complete and any changed value has been written to the underlying field.
Subscribers will be called with the following parameters:
this
: Editorvalue
: MixedThe current field value
startValue
: MixedThe original field value
This event is defined by Editor.
destroy
public event destroy
Fires after the component is destroyed.
Subscribers will be called with the following parameters:
disable
public event disable
Fires after the component is disabled.
Subscribers will be called with the following parameters:
enable
public event enable
Fires after the component is enabled.
Subscribers will be called with the following parameters:
hide
public event hide
Fires after the component is hidden.
Subscribers will be called with the following parameters:
render
public event render
Fires after the component is rendered.
Subscribers will be called with the following parameters:
show
public event show
Fires after the component is shown.
Subscribers will be called with the following parameters:
specialkey
public event specialkey
Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed. You can check
Ext.EventObject.getKey to determine which key was pressed.
Subscribers will be called with the following parameters:
this
: Ext.form.Fielde
: Ext.EventObjectThe event object
This event is defined by Editor.
startedit
public event startedit
Fires when this editor is displayed
Subscribers will be called with the following parameters:
This event is defined by Editor.
alignment
alignment : String
This config option is defined by Editor.
allowDomMove
allowDomMove : Boolean
Whether the component can move the Dom node when rendering (defaults to true).
autosize
autosize : Boolean/String
True for the editor to automatically adopt the size of the underlying field, "width" to adopt the width only, or "height" to adopt the height only (defaults to false)
This config option is defined by Editor.
cancelOnEsc
cancelOnEsc : Boolean
True to cancel the edit when the escape key is pressed (defaults to false)
This config option is defined by Editor.
completeOnEnter
completeOnEnter : Boolean
True to complete the edit when the enter key is pressed (defaults to false)
This config option is defined by Editor.
constrain
constrain : Boolean
True to constrain the editor to the viewport
This config option is defined by Editor.
disableClass
disableClass : String
CSS class added to the component when it is disabled (defaults to "x-item-disabled").
hideEl
hideEl : Boolean
False to keep the bound element visible while the editor is displayed (defaults to true)
This config option is defined by Editor.
hideMode
hideMode : String
How this component should hidden. Supported values are "visibility" (css visibility), "offsets" (negative offset position) and "display" (css display) - defaults to "display".
ignoreNoChange
ignoreNoChange : Boolean
True to skip the the edit completion process (no save, no events fired) if the user completes an edit and the value has not changed (defaults to false). Applies only to string values - edits for other data types will never be ignored.
This config option is defined by Editor.
revertInvalid
revertInvalid : Boolean
True to automatically revert the field value and cancel the edit when the user completes an edit and the field validation fails (defaults to true)
This config option is defined by Editor.
shadow
shadow : Boolean/String
"sides" for sides/bottom only, "frame" for 4-way shadow, and "drop" for bottom-right shadow (defaults to "frame")
This config option is defined by Editor.
updateEl
updateEl : Boolean
True to update the innerHTML of the bound element when the update completes (defaults to false)
This config option is defined by Editor.
value
value : Mixed
The data value of the underlying field (defaults to "")
This config option is defined by Editor.