Ext.data.JsonP.Ext_util_Renderable({"alternateClassNames":[],"aliases":{},"enum":null,"parentMixins":[],"tagname":"class","subclasses":[],"extends":"Ext.Base","uses":[],"html":"
Hierarchy
Ext.Base
Ext.util.Renderable
Requires
Ext.dom.Element
Mixed into
Ext.AbstractComponent
Files
Renderable.js

NOTE This is a private utility class for internal use by the framework. Don't rely on its existence.

Given a component hierarchy of this:

\n\n
 {\n     xtype: 'panel',\n     id: 'ContainerA',\n     layout: 'hbox',\n     renderTo: Ext.getBody(),\n     items: [\n         {\n             id: 'ContainerB',\n             xtype: 'container',\n             items: [\n                 { id: 'ComponentA' }\n             ]\n         }\n     ]\n }\n
\n\n

The rendering of the above proceeds roughly like this:

\n\n\n\n

Properties

Defined By

Instance Properties

Ext.Base
view source
: Stringprivate
...
\n

Defaults to: 'Ext.Base'

Ext.Base
view source
: Objectprivate
...
\n

Defaults to: {}

Ext.util.Renderable
view source
: Stringprivate
...
\n

Defaults to: Ext.baseCSSPrefix + 'frame'

Ext.util.Renderable
view source
: Arrayprivate
...
\n

Defaults to: ['TL', 'TC', 'TR', 'ML', 'MC', 'MR', 'BL', 'BC', 'BR']

Ext.util.Renderable
view source
: RegExpprivate
...
\n

Defaults to: /[\\-]frame\\d+[TMB][LCR]$/

Ext.util.Renderable
view source
: Objectprivate
Cache the frame information object so as not to cause style recalculations ...

Cache the frame information object so as not to cause style recalculations

\n

Defaults to: {}

Ext.util.Renderable
view source
frameTableTpl : Objectprivate
\n
\n
Ext.util.Renderable
view source
: Arrayprivate
...
\n

Defaults to: ['{%this.renderDockedItems(out,values,0);%}', '<tpl if="top">', '<tpl if="left"><div id="{fgid}TL" class="{frameCls}-tl {baseCls}-tl {baseCls}-{ui}-tl<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-tl</tpl>{frameElCls}" role="presentation"></tpl>', '<tpl if="right"><div id="{fgid}TR" class="{frameCls}-tr {baseCls}-tr {baseCls}-{ui}-tr<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-tr</tpl>{frameElCls}" role="presentation"></tpl>', '<div id="{fgid}TC" class="{frameCls}-tc {baseCls}-tc {baseCls}-{ui}-tc<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-tc</tpl>{frameElCls}" role="presentation"></div>', '<tpl if="right"></div></tpl>', '<tpl if="left"></div></tpl>', '</tpl>', '<tpl if="left"><div id="{fgid}ML" class="{frameCls}-ml {baseCls}-ml {baseCls}-{ui}-ml<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-ml</tpl>{frameElCls}" role="presentation"></tpl>', '<tpl if="right"><div id="{fgid}MR" class="{frameCls}-mr {baseCls}-mr {baseCls}-{ui}-mr<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-mr</tpl>{frameElCls}" role="presentation"></tpl>', '<div id="{fgid}MC" class="{frameCls}-mc {baseCls}-mc {baseCls}-{ui}-mc<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-mc</tpl>{frameElCls}" role="presentation">', '{%this.applyRenderTpl(out, values)%}', '</div>', '<tpl if="right"></div></tpl>', '<tpl if="left"></div></tpl>', '<tpl if="bottom">', '<tpl if="left"><div id="{fgid}BL" class="{frameCls}-bl {baseCls}-bl {baseCls}-{ui}-bl<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-bl</tpl>{frameElCls}" role="presentation"></tpl>', '<tpl if="right"><div id="{fgid}BR" class="{frameCls}-br {baseCls}-br {baseCls}-{ui}-br<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-br</tpl>{frameElCls}" role="presentation"></tpl>', '<div id="{fgid}BC" class="{frameCls}-bc {baseCls}-bc {baseCls}-{ui}-bc<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-bc</tpl>{frameElCls}" role="presentation"></div>', '<tpl if="right"></div></tpl>', '<tpl if="left"></div></tpl>', '</tpl>', '{%this.renderDockedItems(out,values,1);%}']

Ext.Base
view source
: Arrayprivate
...
\n

Defaults to: []

Ext.Base
view source
: Objectprivate
...
\n

Defaults to: {}

Ext.Base
view source
: Booleanprivate
...
\n

Defaults to: true

Ext.Base
view source
: Ext.Classprotected
Get the reference to the current class from which this object was instantiated. ...

Get the reference to the current class from which this object was instantiated. Unlike statics,\nthis.self is scope-dependent and it's meant to be used for dynamic inheritance. See statics\nfor a detailed comparison

\n\n
Ext.define('My.Cat', {\n    statics: {\n        speciesName: 'Cat' // My.Cat.speciesName = 'Cat'\n    },\n\n    constructor: function() {\n        alert(this.self.speciesName); // dependent on 'this'\n    },\n\n    clone: function() {\n        return new this.self();\n    }\n});\n\n\nExt.define('My.SnowLeopard', {\n    extend: 'My.Cat',\n    statics: {\n        speciesName: 'Snow Leopard'         // My.SnowLeopard.speciesName = 'Snow Leopard'\n    }\n});\n\nvar cat = new My.Cat();                     // alerts 'Cat'\nvar snowLeopard = new My.SnowLeopard();     // alerts 'Snow Leopard'\n\nvar clone = snowLeopard.clone();\nalert(Ext.getClassName(clone));             // alerts 'My.SnowLeopard'\n
\n
Defined By

Static Properties

Ext.Base
view source
: Arrayprivatestatic
...
\n

Defaults to: []

Methods

Defined By

Instance Methods

Ext.util.Renderable
view source
( width, height )private
...
\n

Parameters

Ext.util.Renderable
view source
( )protectedtemplate
Allows addition of behavior after rendering is complete. ...

Allows addition of behavior after rendering is complete. At this stage the Component’s Element\nwill have been styled according to the configuration, will have had any configured CSS class\nnames added, and will be in the configured visibility and the configured enable state.

\n
\n

This is a template method.\n a hook into the functionality of this class.\n Feel free to override it in child classes.

\n
\n
Ext.util.Renderable
view source
( )private
Sets references to elements inside the component. ...

Sets references to elements inside the component. This applies renderSelectors\nas well as childEls.

\n
Ext.util.Renderable
view source
( )private
...
\n
Ext.Base
view source
( args ) : Objectdeprecatedprotected
Call the original method that was previously overridden with override\n\nExt.define('My.Cat', {\n constructor: functi...

Call the original method that was previously overridden with override

\n\n
Ext.define('My.Cat', {\n    constructor: function() {\n        alert(\"I'm a cat!\");\n    }\n});\n\nMy.Cat.override({\n    constructor: function() {\n        alert(\"I'm going to be a cat!\");\n\n        this.callOverridden();\n\n        alert(\"Meeeeoooowwww\");\n    }\n});\n\nvar kitty = new My.Cat(); // alerts \"I'm going to be a cat!\"\n                          // alerts \"I'm a cat!\"\n                          // alerts \"Meeeeoooowwww\"\n
\n
\n

This method has been deprecated

\n

as of 4.1. Use callParent instead.

\n\n
\n

Parameters

  • args : Array/Arguments

    The arguments, either an array or the arguments object\nfrom the current method, for example: this.callOverridden(arguments)

    \n

Returns

  • Object

    Returns the result of calling the overridden method

    \n
Ext.Base
view source
( args ) : Objectprotected
Call the \"parent\" method of the current method. ...

Call the \"parent\" method of the current method. That is the method previously\noverridden by derivation or by an override (see Ext.define).

\n\n
 Ext.define('My.Base', {\n     constructor: function (x) {\n         this.x = x;\n     },\n\n     statics: {\n         method: function (x) {\n             return x;\n         }\n     }\n });\n\n Ext.define('My.Derived', {\n     extend: 'My.Base',\n\n     constructor: function () {\n         this.callParent([21]);\n     }\n });\n\n var obj = new My.Derived();\n\n alert(obj.x);  // alerts 21\n
\n\n

This can be used with an override as follows:

\n\n
 Ext.define('My.DerivedOverride', {\n     override: 'My.Derived',\n\n     constructor: function (x) {\n         this.callParent([x*2]); // calls original My.Derived constructor\n     }\n });\n\n var obj = new My.Derived();\n\n alert(obj.x);  // now alerts 42\n
\n\n

This also works with static methods.

\n\n
 Ext.define('My.Derived2', {\n     extend: 'My.Base',\n\n     statics: {\n         method: function (x) {\n             return this.callParent([x*2]); // calls My.Base.method\n         }\n     }\n });\n\n alert(My.Base.method(10);     // alerts 10\n alert(My.Derived2.method(10); // alerts 20\n
\n\n

Lastly, it also works with overridden static methods.

\n\n
 Ext.define('My.Derived2Override', {\n     override: 'My.Derived2',\n\n     statics: {\n         method: function (x) {\n             return this.callParent([x*2]); // calls My.Derived2.method\n         }\n     }\n });\n\n alert(My.Derived2.method(10); // now alerts 40\n
\n\n

To override a method and replace it and also call the superclass method, use\ncallSuper. This is often done to patch a method to fix a bug.

\n

Parameters

  • args : Array/Arguments

    The arguments, either an array or the arguments object\nfrom the current method, for example: this.callParent(arguments)

    \n

Returns

  • Object

    Returns the result of calling the parent method

    \n
Ext.Base
view source
( args ) : Objectprotected
This method is used by an override to call the superclass method but bypass any\noverridden method. ...

This method is used by an override to call the superclass method but bypass any\noverridden method. This is often done to \"patch\" a method that contains a bug\nbut for whatever reason cannot be fixed directly.

\n\n

Consider:

\n\n
 Ext.define('Ext.some.Class', {\n     method: function () {\n         console.log('Good');\n     }\n });\n\n Ext.define('Ext.some.DerivedClass', {\n     method: function () {\n         console.log('Bad');\n\n         // ... logic but with a bug ...\n\n         this.callParent();\n     }\n });\n
\n\n

To patch the bug in DerivedClass.method, the typical solution is to create an\noverride:

\n\n
 Ext.define('App.paches.DerivedClass', {\n     override: 'Ext.some.DerivedClass',\n\n     method: function () {\n         console.log('Fixed');\n\n         // ... logic but with bug fixed ...\n\n         this.callSuper();\n     }\n });\n
\n\n

The patch method cannot use callParent to call the superclass method since\nthat would call the overridden method containing the bug. In other words, the\nabove patch would only produce \"Fixed\" then \"Good\" in the console log, whereas,\nusing callParent would produce \"Fixed\" then \"Bad\" then \"Good\".

\n

Parameters

  • args : Array/Arguments

    The arguments, either an array or the arguments object\nfrom the current method, for example: this.callSuper(arguments)

    \n

Returns

  • Object

    Returns the result of calling the superclass method

    \n
Ext.Base
view source
( )private
...
\n
Ext.Base
view source
( )private
...
\n

Overrides: Ext.state.Stateful.destroy, Ext.util.ElementContainer.destroy, Ext.AbstractComponent.destroy, Ext.AbstractPlugin.destroy

Ext.util.Renderable
view source
( out, values )private
Called from the selected frame generation template to insert this Component's inner structure inside the framing stru...

Called from the selected frame generation template to insert this Component's inner structure inside the framing structure.

\n\n

When framing is used, a selected frame generation template is used as the primary template of the getElConfig instead\nof the configured renderTpl. The renderTpl is invoked by this method which is injected into the framing template.

\n

Parameters

Ext.util.Renderable
view source
( )
Handles autoRender. ...

Handles autoRender.\nFloating Components may have an ownerCt. If they are asking to be constrained, constrain them within that\nownerCt, and have their z-index managed locally. Floating Components are always rendered to document.body

\n
Ext.util.Renderable
view source
( out, renderData )private
...
\n

Parameters

Ext.util.Renderable
view source
( out, renderData, after )private
...
\n

Parameters

Ext.util.Renderable
view source
( [runLayout] )
Ensures that this component is attached to document.body. ...

Ensures that this component is attached to document.body. If the component was\nrendered to Ext.getDetachedBody, then it will be appended to document.body.\nAny configured position is also restored.

\n

Parameters

  • runLayout : Boolean (optional)

    True to run the component's layout.

    \n

    Defaults to: false

Ext.util.Renderable
view source
( containerIdx )private
This method visits the rendered component tree in a \"top-down\" order. ...

This method visits the rendered component tree in a \"top-down\" order. That is, this\ncode runs on a parent component before running on a child. This method calls the\nonRender method of each component.

\n

Parameters

  • containerIdx : Number

    The index into the Container items of this Component.

    \n
Ext.util.Renderable
view source
( )private
...
\n
Ext.Base
view source
( name )private
...
\n

Parameters

Ext.util.Renderable
view source
( )private
...
\n
Ext.util.Renderable
view source
( )private
On render, reads an encoded style attribute, \"filter\" from the style of this Component's element. ...

On render, reads an encoded style attribute, \"filter\" from the style of this Component's element.\nThis information is memoized based upon the CSS class name of this Component's element.\nBecause child Components are rendered as textual HTML as part of the topmost Container, a dummy div is inserted\ninto the document to receive the document element's CSS class name, and therefore style attributes.

\n
Ext.util.Renderable
view source
( )private
...
\n
Ext.util.Renderable
view source
( table )private
...
\n

Parameters

Ext.util.Renderable
view source
( )private
...
\n
Ext.Base
view source
( [name] ) : Object/Mixed
Returns the initial configuration passed to constructor when instantiating\nthis class. ...

Returns the initial configuration passed to constructor when instantiating\nthis class.

\n

Parameters

  • name : String (optional)

    Name of the config option to return.

    \n

Returns

  • Object/Mixed

    The full config object or a single config value\nwhen name parameter specified.

    \n
Ext.util.Renderable
view source
( position ) : HTMLElement
This function takes the position argument passed to onRender and returns a\nDOM element that you can use in the insert...

This function takes the position argument passed to onRender and returns a\nDOM element that you can use in the insertBefore.

\n

Parameters

Returns

  • HTMLElement

    DOM element that you can use in the insertBefore

    \n
Ext.util.Renderable
view source
( )private
...
\n
Ext.util.Renderable
view source
( cls )private
Returns an offscreen div with the same class name as the element this is being rendered. ...

Returns an offscreen div with the same class name as the element this is being rendered.\nThis is because child item rendering takes place in a detached div which, being not\npart of the document, has no styling.

\n

Parameters

Ext.Base
view source
( config )private
...
\n

Parameters

Ext.Base
view source
( config ) : Ext.Basechainableprotected
Initialize configuration for this class. ...

Initialize configuration for this class. a typical example:

\n\n
Ext.define('My.awesome.Class', {\n    // The default config\n    config: {\n        name: 'Awesome',\n        isAwesome: true\n    },\n\n    constructor: function(config) {\n        this.initConfig(config);\n    }\n});\n\nvar awesome = new My.awesome.Class({\n    name: 'Super Awesome'\n});\n\nalert(awesome.getName()); // 'Super Awesome'\n
\n

Parameters

Returns

Ext.util.Renderable
view source
( container )private
...
\n

Parameters

Ext.util.Renderable
view source
( )private
...
\n
Ext.util.Renderable
view source
( table )private
Poke in a reference to applyRenderTpl(frameInfo, out) ...

Poke in a reference to applyRenderTpl(frameInfo, out)

\n

Parameters

Ext.util.Renderable
view source
( ) : Objectprotected
Initialized the renderData to be used when rendering the renderTpl. ...

Initialized the renderData to be used when rendering the renderTpl.

\n

Returns

  • Object

    Object with keys and values that are going to be applied to the renderTpl

    \n
Ext.util.Renderable
view source
( ) : Ext.XTemplateprivate
Initializes the renderTpl. ...

Initializes the renderTpl.

\n

Returns

Ext.Base
view source
( names, callback, scope )private
...
\n

Parameters

Ext.util.Renderable
view source
( parentNode, containerIdx )protectedtemplate
Template method called when this Component's DOM structure is created. ...

Template method called when this Component's DOM structure is created.

\n\n

At this point, this Component's (and all descendants') DOM structure exists but it has not\nbeen layed out (positioned and sized).

\n\n

Subclasses which override this to gain access to the structure at render time should\ncall the parent class's method before attempting to access any child elements of the Component.

\n
\n

This is a template method.\n a hook into the functionality of this class.\n Feel free to override it in child classes.

\n
\n

Parameters

  • parentNode : Ext.core.Element

    The parent Element in which this Component's encapsulating element is contained.

    \n
  • containerIdx : Number

    The index within the parent Container's child collection of this Component.

    \n
Ext.util.Renderable
view source
( [container], [position] )
Renders the Component into the passed HTML element. ...

Renders the Component into the passed HTML element.

\n\n

If you are using a Container object to house this\nComponent, then do not use the render method.

\n\n

A Container's child Components are rendered by that Container's\nlayout manager when the Container is first rendered.

\n\n

If the Container is already rendered when a new child Component is added, you may need to call\nthe Container's doLayout to refresh the view which\ncauses any unrendered child Components to be rendered. This is required so that you can add\nmultiple child components if needed while only refreshing the layout once.

\n\n

When creating complex UIs, it is important to remember that sizing and positioning\nof child items is the responsibility of the Container's layout\nmanager. If you expect child items to be sized in response to user interactions, you must\nconfigure the Container with a layout manager which creates and manages the type of layout you\nhave in mind.

\n\n

Omitting the Container's layout config means that a basic\nlayout manager is used which does nothing but render child components sequentially into the\nContainer. No sizing or positioning will be performed in this situation.

\n

Parameters

  • container : Ext.Element/HTMLElement/String (optional)

    The element this Component should be\nrendered into. If it is being created from existing markup, this should be omitted.

    \n
  • position : String/Number (optional)

    The element ID or DOM node index within the container before\nwhich this component will be inserted (defaults to appending to the end of the container)

    \n
Ext.Base
view source
( config, applyIfNotSet ) : Ext.Basechainableprivate
...
\n

Parameters

Returns

Ext.util.Renderable
view source
( frameTpl )private
Inject a reference to the function which applies the render template into the framing template. ...

Inject a reference to the function which applies the render template into the framing template. The framing template\nwraps the content.

\n

Parameters

Ext.util.Renderable
view source
( renderTpl )private
...
\n

Parameters

Ext.Base
view source
( ) : Ext.Classprotected
Get the reference to the class from which this object was instantiated. ...

Get the reference to the class from which this object was instantiated. Note that unlike self,\nthis.statics() is scope-independent and it always returns the class from which it was called, regardless of what\nthis points to during run-time

\n\n
Ext.define('My.Cat', {\n    statics: {\n        totalCreated: 0,\n        speciesName: 'Cat' // My.Cat.speciesName = 'Cat'\n    },\n\n    constructor: function() {\n        var statics = this.statics();\n\n        alert(statics.speciesName);     // always equals to 'Cat' no matter what 'this' refers to\n                                        // equivalent to: My.Cat.speciesName\n\n        alert(this.self.speciesName);   // dependent on 'this'\n\n        statics.totalCreated++;\n    },\n\n    clone: function() {\n        var cloned = new this.self;                      // dependent on 'this'\n\n        cloned.groupName = this.statics().speciesName;   // equivalent to: My.Cat.speciesName\n\n        return cloned;\n    }\n});\n\n\nExt.define('My.SnowLeopard', {\n    extend: 'My.Cat',\n\n    statics: {\n        speciesName: 'Snow Leopard'     // My.SnowLeopard.speciesName = 'Snow Leopard'\n    },\n\n    constructor: function() {\n        this.callParent();\n    }\n});\n\nvar cat = new My.Cat();                 // alerts 'Cat', then alerts 'Cat'\n\nvar snowLeopard = new My.SnowLeopard(); // alerts 'Cat', then alerts 'Snow Leopard'\n\nvar clone = snowLeopard.clone();\nalert(Ext.getClassName(clone));         // alerts 'My.SnowLeopard'\nalert(clone.groupName);                 // alerts 'Cat'\n\nalert(My.Cat.totalCreated);             // alerts 3\n
\n

Returns

Ext.util.Renderable
view source
( )private
...
\n
Ext.util.Renderable
view source
( dom )private
...
\n

Parameters

Defined By

Static Methods

Ext.Base
view source
( config )privatestatic
...
\n

Parameters

Ext.Base
view source
( members )chainableprivatestatic
...
\n

Parameters

Ext.Base
view source
( name, member )chainableprivatestatic
...
\n

Parameters

Ext.Base
view source
( members )chainablestatic
Add methods / properties to the prototype of this class. ...

Add methods / properties to the prototype of this class.

\n\n
Ext.define('My.awesome.Cat', {\n    constructor: function() {\n        ...\n    }\n});\n\n My.awesome.Cat.addMembers({\n     meow: function() {\n        alert('Meowww...');\n     }\n });\n\n var kitty = new My.awesome.Cat;\n kitty.meow();\n
\n

Parameters

Ext.Base
view source
( members ) : Ext.Basechainablestatic
Add / override static properties of this class. ...

Add / override static properties of this class.

\n\n
Ext.define('My.cool.Class', {\n    ...\n});\n\nMy.cool.Class.addStatics({\n    someProperty: 'someValue',      // My.cool.Class.someProperty = 'someValue'\n    method1: function() { ... },    // My.cool.Class.method1 = function() { ... };\n    method2: function() { ... }     // My.cool.Class.method2 = function() { ... };\n});\n
\n

Parameters

Returns

Ext.Base
view source
( xtype )chainableprivatestatic
...
\n

Parameters

Ext.Base
view source
( fromClass, members ) : Ext.Basechainableprivatestatic
Borrow another class' members to the prototype of this class. ...

Borrow another class' members to the prototype of this class.

\n\n
Ext.define('Bank', {\n    money: '$$$',\n    printMoney: function() {\n        alert('$$$$$$$');\n    }\n});\n\nExt.define('Thief', {\n    ...\n});\n\nThief.borrow(Bank, ['money', 'printMoney']);\n\nvar steve = new Thief();\n\nalert(steve.money); // alerts '$$$'\nsteve.printMoney(); // alerts '$$$$$$$'\n
\n

Parameters

  • fromClass : Ext.Base

    The class to borrow members from

    \n
  • members : Array/String

    The names of the members to borrow

    \n

Returns

Ext.Base
view source
( ) : Objectstatic
Create a new instance of this Class. ...

Create a new instance of this Class.

\n\n
Ext.define('My.cool.Class', {\n    ...\n});\n\nMy.cool.Class.create({\n    someConfig: true\n});\n
\n\n

All parameters are passed to the constructor of the class.

\n

Returns

Ext.Base
view source
( alias, origin )static
Create aliases for existing prototype methods. ...

Create aliases for existing prototype methods. Example:

\n\n
Ext.define('My.cool.Class', {\n    method1: function() { ... },\n    method2: function() { ... }\n});\n\nvar test = new My.cool.Class();\n\nMy.cool.Class.createAlias({\n    method3: 'method1',\n    method4: 'method2'\n});\n\ntest.method3(); // test.method1()\n\nMy.cool.Class.createAlias('method5', 'method3');\n\ntest.method5(); // test.method3() -> test.method1()\n
\n

Parameters

Ext.Base
view source
( config )privatestatic
...
\n

Parameters

Ext.Base
view source
( ) : Stringstatic
Get the current class' name in string format. ...

Get the current class' name in string format.

\n\n
Ext.define('My.cool.Class', {\n    constructor: function() {\n        alert(this.self.getName()); // alerts 'My.cool.Class'\n    }\n});\n\nMy.cool.Class.getName(); // 'My.cool.Class'\n
\n

Returns

Ext.Base
view source
( )deprecatedstatic
Adds members to class. ...

Adds members to class.

\n
\n

This method has been deprecated since 4.1

\n

Use addMembers instead.

\n\n
\n
Ext.Base
view source
( name, mixinClass )privatestatic
Used internally by the mixins pre-processor ...

Used internally by the mixins pre-processor

\n

Parameters

Ext.Base
view source
( fn, scope )chainableprivatestatic
...
\n

Parameters

Ext.Base
view source
( members ) : Ext.Basechainabledeprecatedstatic
Override members of this class. ...

Override members of this class. Overridden methods can be invoked via\ncallParent.

\n\n
Ext.define('My.Cat', {\n    constructor: function() {\n        alert(\"I'm a cat!\");\n    }\n});\n\nMy.Cat.override({\n    constructor: function() {\n        alert(\"I'm going to be a cat!\");\n\n        this.callParent(arguments);\n\n        alert(\"Meeeeoooowwww\");\n    }\n});\n\nvar kitty = new My.Cat(); // alerts \"I'm going to be a cat!\"\n                          // alerts \"I'm a cat!\"\n                          // alerts \"Meeeeoooowwww\"\n
\n\n

As of 4.1, direct use of this method is deprecated. Use Ext.define\ninstead:

\n\n
Ext.define('My.CatOverride', {\n    override: 'My.Cat',\n    constructor: function() {\n        alert(\"I'm going to be a cat!\");\n\n        this.callParent(arguments);\n\n        alert(\"Meeeeoooowwww\");\n    }\n});\n
\n\n

The above accomplishes the same result but can be managed by the Ext.Loader\nwhich can properly order the override and its target class and the build process\ncan determine whether the override is needed based on the required state of the\ntarget class (My.Cat).

\n
\n

This method has been deprecated since 4.1.0

\n

Use Ext.define instead

\n\n
\n

Parameters

  • members : Object

    The properties to add to this class. This should be\nspecified as an object literal containing one or more properties.

    \n

Returns

Ext.Base
view source
( )privatestatic
...
\n
","superclasses":["Ext.Base"],"meta":{"private":true},"code_type":"ext_define","requires":["Ext.dom.Element"],"html_meta":{"private":null},"statics":{"property":[{"tagname":"property","owner":"Ext.Base","meta":{"static":true,"private":true},"name":"$onExtended","id":"static-property-S-onExtended"}],"cfg":[],"css_var":[],"method":[{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"private":true},"name":"addConfig","id":"static-method-addConfig"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"chainable":true,"private":true},"name":"addInheritableStatics","id":"static-method-addInheritableStatics"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"chainable":true,"private":true},"name":"addMember","id":"static-method-addMember"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"chainable":true},"name":"addMembers","id":"static-method-addMembers"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"chainable":true},"name":"addStatics","id":"static-method-addStatics"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"chainable":true,"private":true},"name":"addXtype","id":"static-method-addXtype"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"chainable":true,"private":true},"name":"borrow","id":"static-method-borrow"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true},"name":"create","id":"static-method-create"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true},"name":"createAlias","id":"static-method-createAlias"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"private":true},"name":"extend","id":"static-method-extend"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true},"name":"getName","id":"static-method-getName"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"deprecated":{"text":"Use {@link #addMembers} instead.","version":"4.1"}},"name":"implement","id":"static-method-implement"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"private":true},"name":"mixin","id":"static-method-mixin"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"chainable":true,"private":true},"name":"onExtended","id":"static-method-onExtended"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"chainable":true,"markdown":true,"deprecated":{"text":"Use {@link Ext#define Ext.define} instead","version":"4.1.0"}},"name":"override","id":"static-method-override"},{"tagname":"method","owner":"Ext.Base","meta":{"static":true,"private":true},"name":"triggerExtended","id":"static-method-triggerExtended"}],"event":[],"css_mixin":[]},"files":[{"href":"Renderable2.html#Ext-util-Renderable","filename":"Renderable.js"}],"linenr":1,"members":{"property":[{"tagname":"property","owner":"Ext.Base","meta":{"private":true},"name":"$className","id":"property-S-className"},{"tagname":"property","owner":"Ext.Base","meta":{"private":true},"name":"configMap","id":"property-configMap"},{"tagname":"property","owner":"Ext.util.Renderable","meta":{"private":true},"name":"frameCls","id":"property-frameCls"},{"tagname":"property","owner":"Ext.util.Renderable","meta":{"private":true},"name":"frameElNames","id":"property-frameElNames"},{"tagname":"property","owner":"Ext.util.Renderable","meta":{"private":true},"name":"frameIdRegex","id":"property-frameIdRegex"},{"tagname":"property","owner":"Ext.util.Renderable","meta":{"private":true},"name":"frameInfoCache","id":"property-frameInfoCache"},{"tagname":"property","owner":"Ext.util.Renderable","meta":{"private":true},"name":"frameTableTpl","id":"property-frameTableTpl"},{"tagname":"property","owner":"Ext.util.Renderable","meta":{"private":true},"name":"frameTpl","id":"property-frameTpl"},{"tagname":"property","owner":"Ext.Base","meta":{"private":true},"name":"initConfigList","id":"property-initConfigList"},{"tagname":"property","owner":"Ext.Base","meta":{"private":true},"name":"initConfigMap","id":"property-initConfigMap"},{"tagname":"property","owner":"Ext.Base","meta":{"private":true},"name":"isInstance","id":"property-isInstance"},{"tagname":"property","owner":"Ext.Base","meta":{"protected":true},"name":"self","id":"property-self"}],"cfg":[],"css_var":[],"method":[{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"afterFirstLayout","id":"method-afterFirstLayout"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"protected":true,"template":true},"name":"afterRender","id":"method-afterRender"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"applyRenderSelectors","id":"method-applyRenderSelectors"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"beforeRender","id":"method-beforeRender"},{"tagname":"method","owner":"Ext.Base","meta":{"protected":true,"deprecated":{"text":"as of 4.1. Use {@link #callParent} instead."}},"name":"callOverridden","id":"method-callOverridden"},{"tagname":"method","owner":"Ext.Base","meta":{"protected":true},"name":"callParent","id":"method-callParent"},{"tagname":"method","owner":"Ext.Base","meta":{"protected":true},"name":"callSuper","id":"method-callSuper"},{"tagname":"method","owner":"Ext.Base","meta":{"private":true},"name":"configClass","id":"method-configClass"},{"tagname":"method","owner":"Ext.Base","meta":{"private":true},"name":"destroy","id":"method-destroy"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"doApplyRenderTpl","id":"method-doApplyRenderTpl"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{},"name":"doAutoRender","id":"method-doAutoRender"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"doRenderContent","id":"method-doRenderContent"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"doRenderFramingDockedItems","id":"method-doRenderFramingDockedItems"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{},"name":"ensureAttachedToBody","id":"method-ensureAttachedToBody"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"finishRender","id":"method-finishRender"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"finishRenderChildren","id":"method-finishRenderChildren"},{"tagname":"method","owner":"Ext.Base","meta":{"private":true},"name":"getConfig","id":"method-getConfig"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"getElConfig","id":"method-getElConfig"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"getFrameInfo","id":"method-getFrameInfo"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"getFrameRenderData","id":"method-getFrameRenderData"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"getFrameTpl","id":"method-getFrameTpl"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"getFramingInfoCls","id":"method-getFramingInfoCls"},{"tagname":"method","owner":"Ext.Base","meta":{},"name":"getInitialConfig","id":"method-getInitialConfig"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{},"name":"getInsertPosition","id":"method-getInsertPosition"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"getRenderTree","id":"method-getRenderTree"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"getStyleProxy","id":"method-getStyleProxy"},{"tagname":"method","owner":"Ext.Base","meta":{"private":true},"name":"hasConfig","id":"method-hasConfig"},{"tagname":"method","owner":"Ext.Base","meta":{"chainable":true,"protected":true},"name":"initConfig","id":"method-initConfig"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"initContainer","id":"method-initContainer"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"initFrame","id":"method-initFrame"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"initFramingTpl","id":"method-initFramingTpl"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"protected":true},"name":"initRenderData","id":"method-initRenderData"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"initRenderTpl","id":"method-initRenderTpl"},{"tagname":"method","owner":"Ext.Base","meta":{"private":true},"name":"onConfigUpdate","id":"method-onConfigUpdate"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"protected":true,"template":true},"name":"onRender","id":"method-onRender"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{},"name":"render","id":"method-render"},{"tagname":"method","owner":"Ext.Base","meta":{"chainable":true,"private":true},"name":"setConfig","id":"method-setConfig"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"setupFramingTpl","id":"method-setupFramingTpl"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"setupRenderTpl","id":"method-setupRenderTpl"},{"tagname":"method","owner":"Ext.Base","meta":{"protected":true},"name":"statics","id":"method-statics"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"updateFrame","id":"method-updateFrame"},{"tagname":"method","owner":"Ext.util.Renderable","meta":{"private":true},"name":"wrapPrimaryEl","id":"method-wrapPrimaryEl"}],"event":[],"css_mixin":[]},"inheritable":null,"private":true,"component":false,"name":"Ext.util.Renderable","singleton":false,"override":null,"inheritdoc":null,"id":"class-Ext.util.Renderable","mixins":[],"mixedInto":["Ext.AbstractComponent"]});