+ All Categories
Home > Documents > Ext Define

Ext Define

Date post: 07-Feb-2016
Category:
Upload: srinivasa-helavar
View: 73 times
Download: 0 times
Share this document with a friend
Description:
ex
57
Ext JS 4.2.1 Sencha Docs FILES Ext-more.js Ext-more.js Ext.js Version.js Defined By Ext The Ext namespace (global object) encapsulates all classes, singletons, and utility methods provided by Sencha's libraries. Most user interface Components are at a lower level of nesting in the namespace, but many common utility functions are provided as direct properties of the Ext namespace. Also many frequently used methods from other classes are provided as shortcuts within the Ext namespace. For example Ext.getCmp aliases Ext.ComponentManager.get. Many applications are initiated with Ext.onReady which is called once the DOM is ready. This ensures all scripts have been loaded, preventing dependency issues. For example: Ext.onReady(function(){ new Ext.Component({ renderTo: document.body, html: 'DOM ready!' }); }); For more information about how to use the Ext classes, see: The Learning Center The FAQ The forums Available since: 1.1.0 Properties Ext BLANK_IMAGE_URL : String URL to a 1x1 transparent gif image used by Ext to create inline icons with CSS background images. In older versions of IE, this defaults to "http://sencha.com/s.gif" and you should change this to a URL on your server. For other browsers it uses an inline data URL. Available since: 1.1.0 Ext Logger : Object PRIVATE Available since: 4.1.0 Ext SSL_SECURE_URL : String URL to a blank file used by Ext when in secure mode for iframe src and onReady src to prevent the IE insecure content warning ('about:blank', except for IE in secure mode, which is 'javascript:""'). Available since: 1.1.0 Page 1 of 57 Ext - Ext JS 4.2.1 - Sencha Docs 2/28/2014 http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext
Transcript
Page 1: Ext Define

Ext JS 4.2.1 Sencha Docs

FILES

Ext-more.js

Ext-more.js

Ext.js

Version.js

Defined By

Ext

The Ext namespace (global object) encapsulates all classes, singletons, and

utility methods provided by Sencha's libraries.

Most user interface Components are at a lower level of nesting in the

namespace, but many common utility functions are provided as direct

properties of the Ext namespace.

Also many frequently used methods from other classes are provided as

shortcuts within the Ext namespace. For example Ext.getCmp aliases Ext.ComponentManager.get.

Many applications are initiated with Ext.onReady which is called once the DOM is ready. This ensures all

scripts have been loaded, preventing dependency issues. For example:

Ext.onReady(function(){

new Ext.Component({

renderTo: document.body,

html: 'DOM ready!'

});

});

For more information about how to use the Ext classes, see:

• The Learning Center

• The FAQ

• The forums

Available since: 1.1.0

Properties

ExtBLANK_IMAGE_URL : String

URL to a 1x1 transparent gif image used by Ext to create inline icons with CSS background

images. In older versions of IE, this defaults to "http://sencha.com/s.gif" and you should change this to

a URL on your server. For other browsers it uses an inline data URL.

Available since: 1.1.0

ExtLogger : Object PRIVATE

Available since: 4.1.0

ExtSSL_SECURE_URL : String

URL to a blank file used by Ext when in secure mode for iframe src and onReady src to

prevent the IE insecure content warning ('about:blank', except for IE in secure mode, which is

'javascript:""').

Available since: 1.1.0

Page 1 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 2: Ext Define

ExtUSE_NATIVE_JSON : Boolean

Indicates whether to use native browser parsing for JSON methods. This option is ignored

if the browser does not support native JSON methods.

Note: Native JSON methods will not work with objects that have functions. Also, property names must

be quoted, otherwise the data will not parse.

Defaults to: false

Available since: 3.4.0

ExtchromeVersion : Number

The current version of Chrome (0 if the browser is not Chrome).

Available since: 4.0.5

ExtemptyFn : Function

A reusable empty function

Available since: 2.3.0

ExtemptyString : Object

A zero length string which will pass a truth test. Useful for passing to methods which use a

truth test to reject falsy values where a string value must be cleared.

Available since: 4.1.0

ExtenableFx : Boolean

True if the Ext.fx.Anim Class is available.

Available since: 3.4.0

ExtenableGarbageCollector : Boolean

True to automatically uncache orphaned Ext.Elements periodically

Defaults to: true

Available since: 1.1.0

ExtenableListenerCollection : Boolean

True to automatically purge event listeners during garbageCollection.

Defaults to: true

Available since: 1.1.0

ExtenableNestedListenerRemoval : Boolean

Experimental. True to cascade listener removal to child elements when an element is

removed. Currently not optimized for performance.

Defaults to: false

Available since: 3.4.0

enumerables : String[]

Page 2 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 3: Ext Define

ExtAn array containing extra enumerables for old browsers

Available since: 4.0.0

ExtfirefoxVersion : Number

The current version of Firefox (0 if the browser is not Firefox).

Available since: 4.0.5

ExtfunctionFactoryCache : Object PRIVATE

Defaults to: {}

Available since: 4.1.0

ExtglobalEvents : Ext.util.Observable

An instance of Ext.util.Observable through which Ext fires global events.

This Observable instance fires the following events:

• idle

Fires when an event handler finishes its run, just before returning to browser control.

This includes DOM event handlers, Ajax (including JSONP) event handlers, and TaskRunners

This can be useful for performing cleanup, or update tasks which need to happen only after all

code in an event handler has been run, but which should not be executed in a timer due to the

intervening browser reflow/repaint which would take place.

• ready

Fires when the DOM is ready, and all required classes have been loaded. Functionally the same

as onReady, but must be called with the single option:

Ext.on({

ready: function() {

console.log('document is ready!');

},

single: true

});

• resumelayouts

Fires after global layout processing has been resumed in

Ext.AbstractComponent.resumeLayouts.

Available since: 4.1.2

ExtieVersion : Number

The current version of IE (0 if the browser is not IE). This does not account for the

documentMode of the current page, which is factored into isIE7, isIE8 and isIE9. Thus this is not

always true:

Ext.isIE8 == (Ext.ieVersion == 8)

Page 3 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 4: Ext Define

Available since: 4.0.5

ExtisChrome : Boolean

True if the detected browser is Chrome.

Available since: 2.3.0

ExtisFF10 : Boolean

True if the detected browser uses FireFox 10

Available since: 4.1.0

ExtisFF3_0 : Boolean

True if the detected browser uses FireFox 3.0

Available since: 4.0.0

ExtisFF3_5 : Boolean

True if the detected browser uses FireFox 3.5

Available since: 4.0.0

ExtisFF3_6 : Boolean

True if the detected browser uses FireFox 3.6

Available since: 4.0.0

ExtisFF4 : Boolean

True if the detected browser uses FireFox 4

Available since: 4.0.5

ExtisFF5 : Boolean

True if the detected browser uses FireFox 5

Available since: 4.0.5

ExtisGecko : Boolean

True if the detected browser uses the Gecko layout engine (e.g. Mozilla, Firefox).

Available since: 1.1.0

ExtisGecko10 : Boolean

True if the detected browser uses a Gecko 5.0+ layout engine (e.g. Firefox 5.x).

Available since: 4.1.0

ExtisGecko3 : Boolean

True if the detected browser uses a Gecko 1.9+ layout engine (e.g. Firefox 3.x).

Available since: 1.1.0

isGecko4 : Boolean

Page 4 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 5: Ext Define

ExtTrue if the detected browser uses a Gecko 2.0+ layout engine (e.g. Firefox 4.x).

Available since: 4.0.0

ExtisGecko5 : Boolean

True if the detected browser uses a Gecko 5.0+ layout engine (e.g. Firefox 5.x).

Available since: 4.0.5

ExtisIE : Boolean

True if the detected browser is Internet Explorer.

Available since: 1.1.0

ExtisIE10 : Boolean

True if the detected browser is Internet Explorer 10.x.

Available since: 4.2.0

ExtisIE10m : Boolean

True if the detected browser is Internet Explorer 10.x or lower.

Available since: 4.2.0

ExtisIE10p : Boolean

True if the detected browser is Internet Explorer 10.x or higher.

Available since: 4.2.0

ExtisIE6 : Boolean

True if the detected browser is Internet Explorer 6.x.

Available since: 1.1.0

ExtisIE7 : Boolean

True if the detected browser is Internet Explorer 7.x.

Available since: 1.1.0

ExtisIE7m : Boolean

True if the detected browser is Internet Explorer 7.x or lower.

Available since: 4.1.3

ExtisIE7p : Boolean

True if the detected browser is Internet Explorer 7.x or higher.

Available since: 4.1.3

ExtisIE8 : Boolean

True if the detected browser is Internet Explorer 8.x.

Available since: 2.3.0

Page 5 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 6: Ext Define

ExtisIE8m : Boolean

True if the detected browser is Internet Explorer 8.x or lower.

Available since: 4.1.3

ExtisIE8p : Boolean

True if the detected browser is Internet Explorer 8.x or higher.

Available since: 4.1.3

ExtisIE9 : Boolean

True if the detected browser is Internet Explorer 9.x.

Available since: 3.4.0

ExtisIE9m : Boolean

True if the detected browser is Internet Explorer 9.x or lower.

Available since: 4.1.3

ExtisIE9p : Boolean

True if the detected browser is Internet Explorer 9.x or higher.

Available since: 4.1.3

ExtisLinux : Boolean

True if the detected platform is Linux.

Available since: 1.1.0

ExtisMac : Boolean

True if the detected platform is Mac OS.

Available since: 1.1.0

ExtisOpera : Boolean

True if the detected browser is Opera.

Available since: 1.1.0

ExtisOpera10_5 : Boolean

True if the detected browser is Opera 10.5x.

Available since: 4.0.0

ExtisReady : Boolean

True when the document is fully initialized and ready for action

Defaults to: false

Available since: 1.1.0

isSafari : Boolean

Page 6 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 7: Ext Define

ExtTrue if the detected browser is Safari.

Available since: 1.1.0

ExtisSafari2 : Boolean

True if the detected browser is Safari 2.x.

Available since: 1.1.0

ExtisSafari3 : Boolean

True if the detected browser is Safari 3.x.

Available since: 1.1.0

ExtisSafari4 : Boolean

True if the detected browser is Safari 4.x.

Available since: 2.3.0

ExtisSafari5 : Boolean

True if the detected browser is Safari 5.x.

Available since: 4.0.5

ExtisSafari5_0 : Boolean

True if the detected browser is Safari 5.0.x.

Available since: 4.1.0

ExtisSecure : Boolean

True if the page is running over SSL

Available since: 1.1.0

ExtisWebKit : Boolean

True if the detected browser uses WebKit.

Available since: 2.3.0

ExtisWindows : Boolean

True if the detected platform is Windows.

Available since: 1.1.0

ExtlastRegisteredVersion : Object PRIVATE

Available since: 4.1.1

ExtmergeIf : Object PRIVATE

Available since: 4.1.1

Extname : String

The name of the property in the global namespace (The window in browser environments)

which refers to the current instance of Ext.

Page 7 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 8: Ext Define

Defined ByMethods

This is usually "Ext", but if a sandboxed build of ExtJS is being used, this will be an alternative

name.

If code is being generated for use by eval or to create a new Function, and the global instance of

Ext must be referenced, this is the name that should be built into the code.

Defaults to: 'Ext'

Available since: 4.1.0

ExtoperaVersion : Number

The current version of Opera (0 if the browser is not Opera).

Available since: 4.0.5

ExtrootHierarchyState : Object PRIVATE

the top level hierarchy state to which all other hierarchy states are chained. If there is a

viewport instance, this object becomes the viewport's heirarchyState. See also

Ext.AbstractComponent.getHierarchyState

Defaults to: {}

Available since: 4.2.0

ExtsafariVersion : Number

The current version of Safari (0 if the browser is not Safari).

Available since: 4.0.5

ExtuseShims : Boolean

By default, Ext intelligently decides whether floating elements should be shimmed. If you

are using flash, you may want to set this to true.

Available since: 1.1.0

Extversions : Object PRIVATE

Defaults to: {}

Available since: 4.1.1

ExtwebKitVersion : Number

The current version of WebKit (0 if the browser does not use WebKit).

Available since: 4.0.1

ExtaddBehaviors( obj )

Applies event listeners to elements by selectors when the document is ready. The event

name is specified with an @ suffix.

Page 8 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 9: Ext Define

Ext.addBehaviors({

// add a listener for click on all anchors in element with id foo

'#foo a@click' : function(e, t){

// do something

},

// add the same listener to multiple selectors (separated by comma BEFORE the @)

'#foo a, #bar span.some-class@mouseover' : function(){

// do something

}

});

Available since: 1.1.0

Parameters

• obj : Object

The list of behaviors to apply

ExtaddNamespaces( namespace )

Adds namespace(s) to known list.

Available since: 4.2.0

Parameters

• namespace : String/String[]

Extapplication( config )

Loads Ext.app.Application class and starts it up with given configuration after the page is

ready.

See Ext.app.Application for details.

Available since: 4.0.1

Parameters

• config : Object/String

Application config object or name of a class derived from Ext.app.Application.

Extapply( object, config, [defaults] ) : Object

Copies all the properties of config to the specified object. Note that if recursive merging and

cloning without referencing the original objects / arrays is needed, use Ext.Object.merge instead.

Available since: 1.1.0

Parameters

• object : Object

The receiver of the properties

Page 9 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 10: Ext Define

• config : Object

The source of the properties

• defaults : Object (optional)

A different object that will also be applied for default values

Returns

• Object

returns obj

ExtapplyIf( object, config ) : Object

Copies all the properties of config to object if they don't already exist.

Available since: 1.1.0

Parameters

• object : Object

The receiver of the properties

• config : Object

The source of the properties

Returns

• Object

returns obj

ExtbatchLayouts( fn, [scope] )

Utility wrapper that suspends layouts of all components for the duration of a given function.

Available since: 4.1.1

Parameters

• fn : Function

The function to execute.

• scope : Object (optional)

The scope (this reference) in which the specified function is executed.

Extbind( fn, [scope], [args], [appendArgs] ) : Function

Create a new function from the provided fn, change this to the provided scope, optionally

overrides arguments for the call. (Defaults to the arguments passed by the caller)

Ext.bind is alias for Ext.Function.bind

Available since: 4.0.0

Page 10 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 11: Ext Define

Parameters

• fn : Function

The function to delegate.

• scope : Object (optional)

The scope (this reference) in which the function is executed. If omitted, defaults to the default

global environment object (usually the browser window).

• args : Array (optional)

Overrides arguments for the call. (Defaults to the arguments passed by the caller)

• appendArgs : Boolean/Number (optional)

if True args are appended to call args instead of overriding, if a number the args are inserted at

the specified position

Returns

• Function

The new function

Extcallback( callback, [scope], [args], [delay] ) : Object

Execute a callback function in a particular scope. If callback argument is a function

reference, that is called. If it is a string, the string is assumed to be the name of a method on the given

scope. If no function is passed the call is ignored.

For example, these calls are equivalent:

var myFunc = this.myFunc;

Ext.callback('myFunc', this, [arg1, arg2]);

Ext.callback(myFunc, this, [arg1, arg2]);

Ext.isFunction(myFunc) && this.myFunc(arg1, arg2);

Available since: 4.0.0

Parameters

• callback : Function

The callback to execute

• scope : Object (optional)

The scope to execute in

• args : Array (optional)

The arguments to pass to the function

• delay : Number (optional)

Pass a number to delay the call by a number of milliseconds.

Returns

Page 11 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 12: Ext Define

• Object

The value returned by the callback or undefined (if there is a delay or if the callback is not a

function).

Extclean( array ) : Array DEPRECATED

Old alias to Ext.Array.clean

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Use Ext.Array.clean instead

Parameters

• array : Array

Returns

• Array

results

ExtclearNamespaces( ) PRIVATE

Clear all namespaces from known list.

Available since: 4.2.0

Extclone( item ) : Object

Clone simple variables including array, {}-like objects, DOM nodes and Date without

keeping the old reference. A reference for the object itself is returned if it's not a direct decendant of

Object. For model cloning, see Model.copy.

Available since: 4.0.0

Parameters

• item : Object

The variable to clone

Returns

• Object

clone

Extcoerce( from, to ) : Object

Coerces the first value if possible so that it is comparable to the second value.

Coercion only works between the basic atomic data types String, Boolean, Number, Date, null and

undefined.

Numbers and numeric strings are coerced to Dates using the value as the millisecond era value.

Page 12 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 13: Ext Define

Strings are coerced to Dates by parsing using the defaultFormat.

For example

Ext.coerce('false', true);

returns the boolean value false because the second parameter is of type Boolean.

Available since: 4.2.0

Parameters

• from : Mixed

The value to coerce

• to : Mixed

The value it must be compared against

Returns

• Object

The coerced value.

ExtcollectNamespaces( paths ) PRIVATE

Available since: 4.2.0

Parameters

• paths : Object

ExtcopyTo( dest, source, names, [usePrototypeKeys] ) : Object

Copies a set of named properties fom the source object to the destination object.

Example:

ImageComponent = Ext.extend(Ext.Component, {

initComponent: function() {

this.autoEl = { tag: 'img' };

MyComponent.superclass.initComponent.apply(this, arguments);

this.initialBox = Ext.copyTo({}, this.initialConfig, 'x,y,width,height'

}

});

Important note: To borrow class prototype methods, use Ext.Base.borrow instead.

Available since: 3.4.0

Parameters

• dest : Object

Page 13 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 14: Ext Define

The destination object.

• source : Object

The source object.

• names : String/String[]

Either an Array of property names, or a comma-delimited list of property names to copy.

• usePrototypeKeys : Boolean (optional)

Defaults to false. Pass true to copy keys off of the prototype as well as the instance.

Returns

• Object

The modified object.

Extcreate( [name], [args] ) : Object

Instantiate a class by either full name, alias or alternate name.

If Ext.Loader is enabled and the class has not been defined yet, it will attempt to load the class via

synchronous loading.

For example, all these three lines return the same result:

// alias

var window = Ext.create('widget.window', {

width: 600,

height: 800,

...

});

// alternate name

var window = Ext.create('Ext.Window', {

width: 600,

height: 800,

...

});

// full class name

var window = Ext.create('Ext.window.Window', {

width: 600,

height: 800,

...

});

// single object with xclass property:

var window = Ext.create({

xclass: 'Ext.window.Window', // any valid value for 'name' (above)

width: 600,

height: 800,

...

});

Page 14 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 15: Ext Define

Available since: 3.4.0

Parameters

• name : String (optional)

The class name or alias. Can be specified as xclass property if only one object parameter is

specified.

• args : Object... (optional)

Additional arguments after the name will be passed to the class' constructor.

Returns

• Object

instance

ExtcreateByAlias( alias, args ) : Object

Instantiate a class by its alias.

Ext.ClassManager.instantiateByAlias is usually invoked by the shorthand createByAlias.

If Ext.Loader is enabled and the class has not been defined yet, it will attempt to load the class via

synchronous loading.

var window = Ext.createByAlias('widget.window', { width: 600, height: 800,

Available since: 4.0.0

Parameters

• alias : String

• args : Object...

Additional arguments after the alias will be passed to the class constructor.

Returns

• Object

instance

ExtcreateWidget( ) DEPRECATED

Old name for widget.

Available since: 4.0.2

This method has been DEPRECATED since 4.0.0

Use widget instead.

decode( json, [safe] ) : Object

Page 15 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 16: Ext Define

ExtShorthand for Ext.JSON.decode

Available since: 1.1.0

Parameters

• json : String

The JSON string

• safe : Boolean (optional)

True to return null, false to throw an exception if the JSON is invalid.

Defaults to: false

Returns

• Object

The resulting object

Extdefer( fn, millis, [scope], [args], [appendArgs] ) : Number

Calls this function after the number of millseconds specified, optionally in a specific scope.

Example usage:

var sayHi = function(name){

alert('Hi, ' + name);

}

// executes immediately:

sayHi('Fred');

// executes after 2 seconds:

Ext.Function.defer(sayHi, 2000, this, ['Fred']);

// this syntax is sometimes useful for deferring

// execution of an anonymous function:

Ext.Function.defer(function(){

alert('Anonymous');

}, 100);

Ext.defer is alias for Ext.Function.defer

Available since: 3.4.0

Parameters

• fn : Function

The function to defer.

• millis : Number

The number of milliseconds for the setTimeout call (if less than or equal to 0 the function is

executed immediately)

• scope : Object (optional)

Page 16 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 17: Ext Define

The scope (this reference) in which the function is executed. If omitted, defaults to the

browser window.

• args : Array (optional)

Overrides arguments for the call. (Defaults to the arguments passed by the caller)

• appendArgs : Boolean/Number (optional)

if True args are appended to call args instead of overriding, if a number the args are inserted at

the specified position

Returns

• Number

The timeout id that can be used with clearTimeout

Extdefine( className, data, createdFn ) : Ext.Base

Defines a class or override. A basic class is defined like this:

Ext.define('My.awesome.Class', {

someProperty: 'something',

someMethod: function(s) {

alert(s + this.someProperty);

}

...

});

var obj = new My.awesome.Class();

obj.someMethod('Say '); // alerts 'Say something'

To create an anonymous class, pass null for the className:

Ext.define(null, {

constructor: function () {

// ...

}

});

In some cases, it is helpful to create a nested scope to contain some private properties. The best way

to do this is to pass a function instead of an object as the second parameter. This function will be

called to produce the class body:

Ext.define('MyApp.foo.Bar', function () {

var id = 0;

return {

nextId: function () {

return ++id;

Page 17 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 18: Ext Define

}

};

});

Note that when using override, the above syntax will not override successfully, because the passed

function would need to be executed first to determine whether or not the result is an override or

defining a new object. As such, an alternative syntax that immediately invokes the function can be

used:

Ext.define('MyApp.override.BaseOverride', function () {

var counter = 0;

return {

override: 'Ext.Component',

logId: function () {

console.log(++counter, this.id);

}

};

}());

When using this form of Ext.define, the function is passed a reference to its class. This can be

used as an efficient way to access any static properties you may have:

Ext.define('MyApp.foo.Bar', function (Bar) {

return {

statics: {

staticMethod: function () {

// ...

}

},

method: function () {

return Bar.staticMethod();

}

};

});

To define an override, include the override property. The content of an override is aggregated with

the specified class in order to extend or modify that class. This can be as simple as setting default

property values or it can extend and/or replace methods. This can also extend the statics of the class.

One use for an override is to break a large class into manageable pieces.

// File: /src/app/Panel.js

Ext.define('My.app.Panel', {

extend: 'Ext.panel.Panel',

requires: [

'My.app.PanelPart2',

'My.app.PanelPart3'

]

Page 18 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 19: Ext Define

constructor: function (config) {

this.callParent(arguments); // calls Ext.panel.Panel's constructor

//...

},

statics: {

method: function () {

return 'abc';

}

}

});

// File: /src/app/PanelPart2.js

Ext.define('My.app.PanelPart2', {

override: 'My.app.Panel',

constructor: function (config) {

this.callParent(arguments); // calls My.app.Panel's constructor

//...

}

});

Another use of overrides is to provide optional parts of classes that can be independently required. In

this case, the class may even be unaware of the override altogether.

Ext.define('My.ux.CoolTip', {

override: 'Ext.tip.ToolTip',

constructor: function (config) {

this.callParent(arguments); // calls Ext.tip.ToolTip's constructor

//...

}

});

The above override can now be required as normal.

Ext.define('My.app.App', {

requires: [

'My.ux.CoolTip'

]

});

Overrides can also contain statics:

Ext.define('My.app.BarMod', {

override: 'Ext.foo.Bar',

statics: {

method: function (x) {

return this.callParent([x * 2]); // call Ext.foo.Bar.method

Page 19 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 20: Ext Define

}

}

});

IMPORTANT: An override is only included in a build if the class it overrides is required. Otherwise, the

override, like the target class, is not included.

Available since: 3.4.0

Parameters

• className : String

The class name to create in string dot-namespaced format, for example:

'My.very.awesome.Class', 'FeedViewer.plugin.CoolPager' It is highly recommended to follow this

simple convention: - The root and the class name are 'CamelCased' - Everything else is lower-

cased Pass null to create an anonymous class.

• data : Object

The key - value pairs of properties to apply to this class. Property names can be of any valid

strings, except those in the reserved listed below: - mixins - statics - config - alias - self

- singleton - alternateClassName - override

• createdFn : Function

Optional callback to execute after the class is created, the execution scope of which (this) will

be the newly created class itself.

Returns

• Ext.Base

Extdeprecate( packageName, since, closure, scope )

Create a closure for deprecated code.

// This means Ext.oldMethod is only supported in 4.0.0beta and older.

// If Ext.getVersion('extjs') returns a version that is later than '4.0.0beta', for example '4.0.0RC',

// the closure will not be invoked

Ext.deprecate('extjs', '4.0.0beta', function() {

Ext.oldMethod = Ext.newMethod;

...

});

Available since: 4.1.1

Parameters

• packageName : String

The package name

• since : String

The last version before it's deprecated

Page 20 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 21: Ext Define

• closure : Function

The callback function to be executed with the specified version is less than the current version

• scope : Object

The execution scope (this) if the closure

Extdestroy( args )

Attempts to destroy any objects passed to it by removing all event listeners, removing them

from the DOM (if applicable) and calling their destroy functions (if available). This method is primarily

intended for arguments of type Ext.Element and Ext.Component, but any subclass of

Ext.util.Observable can be passed in. Any number of elements and/or components can be passed into

this function in a single call as separate arguments.

Available since: 1.1.0

Parameters

• args : Ext.dom.Element/Ext.util.Observable/Ext.dom.Element[]/Ext.util.Observable[]...

Any number of elements or components, or an Array of either of these to destroy.

ExtdestroyMembers( o, args )

Attempts to destroy and then remove a set of named properties of the passed object.

Available since: 3.4.0

Parameters

• o : Object

The object (most likely a Component) who's properties you wish to destroy.

• args : String...

One or more names of the properties to destroy and remove from the object.

Exteach( iterable, fn, [scope], [reverse] ) : Boolean

Iterates an array or an iterable value and invoke the given callback function for each item.

var countries = ['Vietnam', 'Singapore', 'United States', 'Russia'];

Ext.Array.each(countries, function(name, index, countriesItSelf) {

console.log(name);

});

var sum = function() {

var sum = 0;

Ext.Array.each(arguments, function(value) {

sum += value;

});

return sum;

Page 21 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 22: Ext Define

};

sum(1, 2, 3); // returns 6

The iteration can be stopped by returning false in the function callback.

Ext.Array.each(countries, function(name, index, countriesItSelf) {

if (name === 'Singapore') {

return false; // break here

}

});

Ext.each is alias for Ext.Array.each

Available since: 1.1.0

Parameters

• iterable : Array/NodeList/Object

The value to be iterated. If this argument is not iterable, the callback function is called once.

• fn : Function

The callback function. If it returns false, the iteration stops and this method returns the current

index.

Parameters

• item : Object

The item at the current index in the passed array

• index : Number

The current index within the array

• allItems : Array

The array itself which was passed as the first argument

Returns

• Boolean

Return false to stop iteration.

• scope : Object (optional)

The scope (this reference) in which the specified function is executed.

• reverse : Boolean (optional)

Reverse the iteration order (loop from the end to the beginning) Defaults false

Returns

• Boolean

See description for the fn parameter.

Page 22 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 23: Ext Define

Extencode( o ) : String

Shorthand for Ext.JSON.encode

Available since: 1.1.0

Parameters

• o : Object

The variable to encode

Returns

• String

The JSON string

ExtescapeRe( str ) : String DEPRECATED

Escapes the passed string for use in a regular expression.

Available since: 1.1.0

This method has been DEPRECATED since 4.0.0

Use Ext.String.escapeRegex instead

Parameters

• str : String

Returns

• String

Extexclude( excludes ) : Object

Convenient shortcut to Ext.Loader.exclude

Available since: 4.0.0

Parameters

• excludes : Array

Returns

• Object

object contains require method for chaining

Extextend( superclass, overrides ) : Function DEPRECATED

This method deprecated. Use Ext.define instead.

Available since: 1.1.0

Page 23 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 24: Ext Define

This method has been DEPRECATED since 4.0.0

Use Ext.define instead

Parameters

• superclass : Function

• overrides : Object

Returns

• Function

The subclass constructor from the overrides parameter, or a generated one if not provided.

Extflatten( array ) : Array DEPRECATED

Old alias to Ext.Array.flatten

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Use Ext.Array.flatten instead

Parameters

• array : Array

The array to flatten

Returns

• Array

The 1-d array.

Extfly( dom, [named] ) : Ext.dom.Element.Fly

Gets the singleton flyweight element, with the passed node as the active element.

Because it is a singleton, this Flyweight does not have an ID, and must be used and discarded in a

single line. You may not keep and use the reference to this singleton over multiple lines because

methods that you call may themselves make use of fly and may change the DOM element to which

the instance refers.

fly is alias for Ext.dom.AbstractElement.fly.

Use this to make one-time references to DOM elements which are not going to be accessed again

either by application code, or by Ext's classes. If accessing an element which will be processed

regularly, then Ext.get will be more appropriate to take advantage of the caching provided by the

Ext.dom.Element class.

Available since: 2.3.0

Parameters

• dom : String/HTMLElement

Page 24 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 25: Ext Define

The dom node or id

• named : String (optional)

Allows for creation of named reusable flyweights to prevent conflicts (e.g. internally Ext uses

"_global")

Returns

• Ext.dom.Element.Fly

The singleton flyweight object (or null if no matching element was found)

Extget( el ) : Ext.dom.Element

Retrieves Ext.dom.Element objects. get is alias for Ext.dom.Element.get.

This method does not retrieve Components. This method retrieves Ext.dom.Element objects which

encapsulate DOM elements. To retrieve a Component by its ID, use Ext.ComponentManager.get.

When passing an id, it should not include the # character that is used for a css selector.

// For an element with id 'foo'

Ext.get('foo'); // Correct

Ext.get('#foo'); // Incorrect

Uses simple caching to consistently return the same object. Automatically fixes if an object was

recreated with the same id via AJAX or DOM.

Available since: 1.1.0

Parameters

• el : String/HTMLElement/Ext.Element

The id of the node, a DOM Node or an existing Element.

Returns

• Ext.dom.Element

The Element object (or null if no matching element was found)

ExtgetBody( ) : Ext.Element

Returns the current document body as an Ext.Element.

Available since: 2.3.0

Returns

• Ext.Element

The document body

ExtgetClass( object ) : Ext.Class

Get the class of the provided object; returns null if it's not an instance of any class created

with Ext.define.

Page 25 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 26: Ext Define

Ext.ClassManager.getClass is usually invoked by the shorthand getClass.

var component = new Ext.Component();

Ext.getClass(component); // returns Ext.Component

Available since: 4.0.2

Parameters

• object : Object

Returns

• Ext.Class

class

ExtgetClassName( object ) : String

Get the name of the class by its reference or its instance;

Ext.ClassManager.getName is usually invoked by the shorthand getClassName.

Ext.getName(Ext.Action); // returns "Ext.Action"

Available since: 4.0.0

Parameters

• object : Ext.Class/Object

Returns

• String

className

ExtgetCmp( id ) : Object

This is shorthand reference to Ext.ComponentManager.get. Looks up an existing

Component by id

Available since: 1.1.0

Parameters

• id : String

The component id

Returns

• Object

Ext.Component The Component, undefined if not found, or null if a Class was found.

Page 26 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 27: Ext Define

ExtgetDetachedBody( ) PRIVATE

Available since: 4.1.0

ExtgetDoc( ) : Ext.Element

Returns the current HTML document object as an Ext.Element.

Available since: 2.3.0

Returns

• Ext.Element

The document

ExtgetDom( el ) : Object

Returns the dom node for the passed String (id), dom node, or Ext.Element. Optional 'strict'

flag is needed for IE since it can return 'name' and 'id' elements by using getElementById.

Here are some examples:

// gets dom node based on id

var elDom = Ext.getDom('elId');

// gets dom node based on the dom node

var elDom1 = Ext.getDom(elDom);

// If we don't know if we are working with an

// Ext.Element or a dom node use Ext.getDom

function(el){

var dom = Ext.getDom(el);

// do something with the dom node

}

Note: the dom node to be found actually needs to exist (be rendered, etc) when this method is called

to be successful.

Available since: 1.1.0

Parameters

• el : String/HTMLElement/Ext.Element

Returns

• Object

HTMLElement

ExtgetElementById( id ) PRIVATE

Available since: 4.1.0

Parameters

• id : Object

Page 27 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 28: Ext Define

ExtgetHead( ) : Ext.Element

Returns the current document head as an Ext.Element.

Available since: 3.4.0

Returns

• Ext.Element

The document head

ExtgetNamespace( className ) : String

Get namespace prefix for a class name.

Available since: 4.2.0

Parameters

• className : String

Returns

• String

Namespace prefix if it's known, otherwise undefined

ExtgetOrientation( ) : String

Returns the current orientation of the mobile device

Available since: 4.0.0

Returns

• String

Either 'portrait' or 'landscape'

ExtgetScrollBarWidth( [force] ) : Number DEPRECATED

Utility method for getting the width of the browser's vertical scrollbar. This can differ

depending on operating system settings, such as the theme or font size.

This method is deprected in favor of getScrollbarSize.

Available since: 3.4.0

This method has been DEPRECATED

Parameters

• force : Boolean (optional)

true to force a recalculation of the value.

Returns

Page 28 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 29: Ext Define

• Number

The width of a vertical scrollbar.

ExtgetScrollbarSize( [force] ) : Object

Returns the size of the browser scrollbars. This can differ depending on operating system

settings, such as the theme or font size.

Available since: 4.0.2

Parameters

• force : Boolean (optional)

true to force a recalculation of the value.

Returns

• Object

An object containing scrollbar sizes.

• width : Number

The width of the vertical scrollbar.

• height : Number

The height of the horizontal scrollbar.

ExtgetStore( store ) : Ext.data.Store

Shortcut to Ext.data.StoreManager.lookup.

Available since: 4.0.0

Parameters

• store : String/Object

The id of the Store, or a Store instance, or a store configuration

Returns

• Ext.data.Store

ExtgetUniqueGlobalNamespace( ) PRIVATE

Generate a unique reference of Ext in the global scope, useful for sandboxing

Available since: 4.0.0

ExtgetVersion( [packageName] ) : Ext.Version

Get the version number of the supplied package name; will return the last registered

version (last Ext.setVersion call) if there's no package name given.

Available since: 4.1.1

Parameters

Page 29 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 30: Ext Define

• packageName : String (optional)

The package name, for example: 'core', 'touch', 'extjs'

Returns

• Ext.Version

The version

ExthtmlDecode( value ) : String DEPRECATED

Old alias to Ext.String.htmlDecode

Available since: 4.0.0

This method has been DEPRECATED

Use Ext.String.htmlDecode instead

Parameters

• value : String

The string to decode.

Returns

• String

The decoded text.

ExthtmlEncode( value ) : String DEPRECATED

Old alias to Ext.String.htmlEncode

Available since: 4.0.0

This method has been DEPRECATED

Use Ext.String.htmlEncode instead

Parameters

• value : String

The string to encode.

Returns

• String

The encoded text.

Extid( [el], [prefix] ) : String

Generates unique ids. If the element already has an id, it is unchanged

Available since: 1.1.0

Page 30 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 31: Ext Define

Parameters

• el : HTMLElement/Ext.Element (optional)

The element to generate an id for

• prefix : String (optional)

Id prefix (defaults "ext-gen")

Returns

• String

The generated Id.

ExtidentityFn( o )

A reusable identity function. The function will always return the first argument, unchanged.

Available since: 4.1.2

Parameters

• o : Object

Extinvoke( arr, methodName, args ) : Array DEPRECATED

Invokes a method on each item in an Array.

Example:

Ext.invoke(Ext.query("p"), "getAttribute", "id");

// [el1.getAttribute("id"), el2.getAttribute("id"), ..., elN.getAttribute("id")]

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Will be removed in the next major version

Parameters

• arr : Array/NodeList

The Array of items to invoke the method on.

• methodName : String

The method name to invoke.

• args : Object...

Arguments to send into the method invocation.

Returns

• Array

Page 31 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 32: Ext Define

The results of invoking the method on each item in the array.

ExtisArray( target ) : Boolean

Returns true if the passed value is a JavaScript Array, false otherwise.

Available since: 2.3.0

Parameters

• target : Object

The target to test

Returns

• Boolean

ExtisBoolean( value ) : Boolean

Returns true if the passed value is a boolean.

Available since: 3.4.0

Parameters

• value : Object

The value to test

Returns

• Boolean

ExtisDate( object ) : Boolean

Returns true if the passed value is a JavaScript Date object, false otherwise.

Available since: 2.3.0

Parameters

• object : Object

The object to test

Returns

• Boolean

ExtisDefined( value ) : Boolean

Returns true if the passed value is defined.

Available since: 3.4.0

Parameters

• value : Object

Page 32 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 33: Ext Define

The value to test

Returns

• Boolean

ExtisElement( value ) : Boolean

Returns true if the passed value is an HTMLElement

Available since: 3.4.0

Parameters

• value : Object

The value to test

Returns

• Boolean

ExtisEmpty( value, [allowEmptyString] ) : Boolean

Returns true if the passed value is empty, false otherwise. The value is deemed to be

empty if it is either:

• null

• undefined

• a zero-length array

• a zero-length string (Unless the allowEmptyString parameter is set to true)

Available since: 1.1.0

Parameters

• value : Object

The value to test

• allowEmptyString : Boolean (optional)

true to allow empty strings (defaults to false)

Returns

• Boolean

ExtisFunction( value ) : Boolean

Returns true if the passed value is a JavaScript Function, false otherwise.

Available since: 3.4.0

Parameters

• value : Object

The value to test

Page 33 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 34: Ext Define

Returns

• Boolean

ExtisIterable( value ) : Boolean

Returns true if the passed value is iterable, that is, if elements of it are addressable using

array notation with numeric indices, false otherwise.

Arrays and function arguments objects are iterable. Also HTML collections such as NodeList and

`HTMLCollection' are iterable.

Available since: 4.0.0

Parameters

• value : Object

The value to test

Returns

• Boolean

ExtisNumber( value ) : Boolean

Returns true if the passed value is a number. Returns false for non-finite numbers.

Available since: 3.4.0

Parameters

• value : Object

The value to test

Returns

• Boolean

ExtisNumeric( value ) : Boolean

Validates that a value is numeric.

Available since: 4.0.0

Parameters

• value : Object

Examples: 1, '1', '2.34'

Returns

• Boolean

True if numeric, false otherwise

Page 34 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 35: Ext Define

ExtisObject( value ) : Boolean

Returns true if the passed value is a JavaScript Object, false otherwise.

Available since: 3.4.0

Parameters

• value : Object

The value to test

Returns

• Boolean

ExtisPrimitive( value ) : Boolean

Returns true if the passed value is a JavaScript 'primitive', a string, number or boolean.

Available since: 3.4.0

Parameters

• value : Object

The value to test

Returns

• Boolean

ExtisSimpleObject( value ) PRIVATE

Available since: 4.1.0

Parameters

• value : Object

ExtisString( value ) : Boolean

Returns true if the passed value is a string.

Available since: 3.4.0

Parameters

• value : Object

The value to test

Returns

• Boolean

ExtisTextNode( value ) : Boolean

Returns true if the passed value is a TextNode

Page 35 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 36: Ext Define

Available since: 4.0.0

Parameters

• value : Object

The value to test

Returns

• Boolean

Extiterate( object, fn, [scope] )

Iterates either an array or an object. This method delegates to Ext.Array.each if the given

value is iterable, and Ext.Object.each otherwise.

Available since: 3.4.0

Parameters

• object : Object/Array

The object or array to be iterated.

• fn : Function

The function to be called for each iteration. See and Ext.Array.each and Ext.Object.each for

detailed lists of arguments passed to this function depending on the given object type that is

being iterated.

• scope : Object (optional)

The scope (this reference) in which the specified function is executed. Defaults to the object

being iterated itself.

Extlog( [options], [message] )

Logs a message. If a console is present it will be used. On Opera, the method

"opera.postError" is called. In other cases, the message is logged to an array "Ext.log.out". An

attached debugger can watch this array and view the log. The log buffer is limited to a maximum of

"Ext.log.max" entries (defaults to 250). The Ext.log.out array can also be written to a popup

window by entering the following in the URL bar (a "bookmarklet"):

javascript:void(Ext.log.show());

If additional parameters are passed, they are joined and appended to the message. A technique for

tracing entry and exit of a function is this:

function foo () {

Ext.log({ indent: 1 }, '>> foo');

// log statements in here or methods called from here will be indented

// by one step

Ext.log({ outdent: 1 }, '<< foo');

}

Page 36 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 37: Ext Define

This method does nothing in a release build.

Available since: 4.0.1

Parameters

• options : String/Object (optional)

The message to log or an options object with any of the following properties:

• msg: The message to log (required).

• level: One of: "error", "warn", "info" or "log" (the default is "log").

• dump: An object to dump to the log as part of the message.

• stack: True to include a stack trace in the log.

• indent: Cause subsequent log statements to be indented one step.

• outdent: Cause this and following statements to be one step less indented.

• message : String... (optional)

The message to log (required unless specified in options object).

Extmax( array, [comparisonFn] ) : Object DEPRECATED

Old alias to Ext.Array.max

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Use Ext.Array.max instead

Parameters

• array : Array/NodeList

The Array from which to select the maximum value.

• comparisonFn : Function (optional)

a function to perform the comparision which determines maximization. If omitted the ">" operator

will be used. Note: gt = 1; eq = 0; lt = -1

Parameters

• max : Mixed

Current maximum value.

• item : Mixed

The value to compare with the current maximum.

Returns

• Object

maxValue The maximum value

Extmean( array ) : Number DEPRECATED

Page 37 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 38: Ext Define

Old alias to Ext.Array.mean

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Use Ext.Array.mean instead

Parameters

• array : Array

The Array to calculate the mean value of.

Returns

• Number

The mean.

Extmerge( destination, object ) : Object

A convenient alias method for Ext.Object.merge.

Available since: 4.0.0

Parameters

• destination : Object

The object into which all subsequent objects are merged.

• object : Object...

Any number of objects to merge into the destination.

Returns

• Object

merged The destination object with all passed objects merged in.

Extmin( array, [comparisonFn] ) : Object DEPRECATED

Old alias to Ext.Array.min

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Use Ext.Array.min instead

Parameters

• array : Array/NodeList

The Array from which to select the minimum value.

• comparisonFn : Function (optional)

Page 38 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 39: Ext Define

a function to perform the comparision which determines minimization. If omitted the "<" operator

will be used. Note: gt = 1; eq = 0; lt = -1

Parameters

• min : Mixed

Current minimum value.

• item : Mixed

The value to compare with the current minimum.

Returns

• Object

minValue The minimum value

Extnamespace( namespaces ) : Object

Creates namespaces to be used for scoping variables and classes so that they are not

global. Specifying the last node of a namespace implicitly creates all other nodes. Usage:

Ext.namespace('Company', 'Company.data');

// equivalent and preferable to the above syntax

Ext.ns('Company.data');

Company.Widget = function() { ... };

Company.data.CustomStore = function(config) { ... };

Available since: 1.1.0

Parameters

• namespaces : String...

Returns

• Object

The namespace object. (If multiple arguments are passed, this will be the last namespace

created)

Extns( namespaces ) : Object

Convenient alias for Ext.namespace.

Available since: 3.4.0

Parameters

• namespaces : String...

Returns

Page 39 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 40: Ext Define

• Object

The namespace object. (If multiple arguments are passed, this will be the last namespace

created)

Extnum( value, defaultValue ) : Number DEPRECATED

Validate that a value is numeric and convert it to a number if necessary. Returns the

specified default value if it is not.

Ext.Number.from('1.23', 1); // returns 1.23

Ext.Number.from('abc', 1); // returns 1

Available since: 1.1.0

This method has been DEPRECATED since 4.0.0

Please use Ext.Number.from instead.

Parameters

• value : Object

• defaultValue : Number

The value to return if the original value is non-numeric

Returns

• Number

value, if numeric, defaultValue otherwise

Exton( eventName, [fn], [scope], [options] ) : Object

Shorthand for the Ext.util.Observable.addListener method of the globalEvents Observable

instance.

Available since: 4.2.0

Parameters

• eventName : String/Object

The name of the event to listen for. May also be an object who's property names are event

names.

• fn : Function (optional)

The method the event invokes, or if scope is specified, the name* of the method within the

specified scope. Will be called with arguments given to fireEvent plus the options parameter

described below.

• scope : Object (optional)

The scope (this reference) in which the handler function is executed. If omitted, defaults to

the object which fired the event.

• options : Object (optional)

Page 40 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 41: Ext Define

An object containing handler configuration.

Note: Unlike in ExtJS 3.x, the options object will also be passed as the last argument to every

event handler.

This object may contain any of the following properties:

• scope : Object

The scope (this reference) in which the handler function is executed. If omitted, defaults

to the object which fired the event.

• delay : Number

The number of milliseconds to delay the invocation of the handler after the 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.

• target : Ext.util.Observable

Only call the handler if the event was fired on the target Observable, not if the event was

bubbled up from a child Observable.

• element : String

This option is only valid for listeners bound to Components. The name of a Component

property which references an element to add a listener to.

This option is useful during Component construction to add DOM event listeners to elements

of Components which will exist only after the Component is rendered. For example, to add a

click listener to a Panel's body:

new Ext.panel.Panel({

title: 'The title',

listeners: {

click: this.handlePanelClick,

element: 'body'

}

});

• destroyable : Boolean (optional)

When specified as true, the function returns A Destroyable object. An object which

implements the destroy method which removes all listeners added in this call.

Defaults to: false

• priority : Number (optional)

An optional numeric priority that determines the order in which event handlers are run. Event

handlers with no priority will be run as if they had a priority of 0. Handlers with a higher

priority will be prioritized to run sooner than those with a lower priority. Negative numbers can

be used to set a priority lower than the default. Internally, the framework uses a range of

1000 or greater, and -1000 or lesser for handers that are intended to run before or after all

Page 41 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 42: Ext Define

others, so it is recommended to stay within the range of -999 to 999 when setting the priority

of event handlers in application-level code.

Combining Options

Using the options argument, it is possible to combine different types of listeners:

A delayed, one-time listener.

myPanel.on('hide', this.handleClick, this, {

single: true,

delay: 100

});

Returns

• Object

Only when the destroyable option is specified.

A Destroyable object. An object which implements the destroy method which removes all

listeners added in this call. For example:

this.btnListeners = = myButton.on({

destroyable: true

mouseover: function() { console.log('mouseover'); },

mouseout: function() { console.log('mouseout'); },

click: function() { console.log('click'); }

});

And when those listeners need to be removed:

Ext.destroy(this.btnListeners);

or

this.btnListeners.destroy();

ExtonDocumentReady( fn, [scope], [options] )

Adds a listener to be notified when the document is ready (before onload and before

images are loaded).

onDocumentReady is an alias for Ext.EventManager.onDocumentReady.

Available since: 4.0.0

Parameters

• fn : Function

The method the event invokes.

• scope : Object (optional)

Page 42 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 43: Ext Define

The scope (this reference) in which the handler function executes. Defaults to the browser

window.

• options : Object (optional)

Options object as passed to Ext.Element.addListener.

ExtonReady( fn, scope, options )

Adds a function to be called when the DOM is ready, and all required classes have been

loaded.

If the DOM is ready and all classes are loaded, the passed function is executed immediately.

Available since: 1.1.0

Parameters

• fn : Function

The function callback to be executed

• scope : Object

The execution scope (this reference) of the callback function

• options : Object

The options to modify the listener as passed to addListener.

Extoverride( target, overrides )

Overrides members of the specified target with the given values.

If the target is a class declared using Ext.define, the override method of that class is called (see

Ext.Base.override) given the overrides.

If the target is a function, it is assumed to be a constructor and the contents of overrides are

applied to its prototype using Ext.apply.

If the target is an instance of a class declared using Ext.define, the overrides are applied to only

that instance. In this case, methods are specially processed to allow them to use Ext.Base.callParent.

var panel = new Ext.Panel({ ... });

Ext.override(panel, {

initComponent: function () {

// extra processing...

this.callParent();

}

});

If the target is none of these, the overrides are applied to the target using Ext.apply.

Please refer to Ext.define and Ext.Base.override for further details.

Available since: 1.1.0

Page 43 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 44: Ext Define

Parameters

• target : Object

The target to override.

• overrides : Object

The properties to add or replace on target.

Extpartition( arr, [truth] ) : Array DEPRECATED

Partitions the set into two sets: a true set and a false set.

Example 1:

Ext.partition([true, false, true, true, false]);

// returns [[true, true, true], [false, false]]

Example 2:

Ext.partition(

Ext.query("p"),

function(val){

return val.className == "class1"

}

);

// true are those paragraph elements with a className of "class1",

// false set are those that do not have that className.

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Will be removed in the next major version

Parameters

• arr : Array/NodeList

The array to partition

• truth : Function (optional)

a function to determine truth. If this is omitted the element itself must be able to be evaluated for

its truthfulness.

Returns

• Array

[array of truish values, array of falsy values]

Extpass( fn, args, [scope] ) : Function

Page 44 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 45: Ext Define

Create a new function from the provided fn, the arguments of which are pre-set to args. New

arguments passed to the newly created callback when it's invoked are appended after the pre-set

ones. This is especially useful when creating callbacks.

For example:

var originalFunction = function(){

alert(Ext.Array.from(arguments).join(' '));

};

var callback = Ext.Function.pass(originalFunction, ['Hello', 'World']);

callback(); // alerts 'Hello World'

callback('by Me'); // alerts 'Hello World by Me'

Ext.pass is alias for Ext.Function.pass

Available since: 4.0.0

Parameters

• fn : Function

The original function

• args : Array

The arguments to pass to new callback

• scope : Object (optional)

The scope (this reference) in which the function is executed.

Returns

• Function

The new callback function

Extpluck( array, propertyName ) : Array DEPRECATED

Old alias to Ext.Array.pluck

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Use Ext.Array.pluck instead

Parameters

• array : Array/NodeList

The Array of items to pluck the value from.

• propertyName : String

The property name to pluck from each element.

Page 45 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 46: Ext Define

Returns

• Array

The value from each item in the Array.

Extpreg( ptype, cls )

Shorthand for Ext.PluginManager.registerType

Available since: 3.4.0

Parameters

• ptype : String

The ptype mnemonic string by which the Plugin class may be looked up.

• cls : Function

The new Plugin class.

Extquery( path, [root], [type], [single] ) : HTMLElement[]

Shorthand of Ext.dom.Query.select

Available since: 1.1.0

Parameters

• path : String

The selector/xpath query

• root : HTMLElement (optional)

The start of the query.

Defaults to: document

• type : String (optional)

Either "select" or "simple" for a simple selector match (only valid when used when the call is

deferred to the jsSelect method)

Defaults to: "select"

• single : Boolean (optional)

Pass true to select only the first matching node using document.querySelector (where

available)

Returns

• HTMLElement[]

An array of DOM elements (not a NodeList as returned by querySelectorAll).

ExtregModel( name, config ) : Ext.data.Model DEPRECATED

Old way for creating Model classes. Instead use:

Page 46 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 47: Ext Define

Ext.define("MyModel", {

extend: "Ext.data.Model",

fields: []

});

Available since: 4.0.0

This method has been DEPRECATED since 4.0.0

Use define instead.

Parameters

• name : String

Name of the Model class.

• config : Object

A configuration object for the Model you wish to create.

Returns

• Ext.data.Model

The newly registered Model

ExtregStore( id, config )

Creates a new store for the given id and config, then registers it with the Store Manager.

Sample usage:

Ext.regStore('AllUsers', {

model: 'User'

});

// the store can now easily be used throughout the application

new Ext.List({

store: 'AllUsers',

... other config

});

Available since: 4.0.0

Parameters

• id : String

The id to set on the new store

• config : Object

The store config

ExtremoveNode( node )

Removes a DOM node from the document.

Page 47 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 48: Ext Define

Removes this element from the document, removes all DOM event listeners, and deletes the cache

reference. All DOM event listeners are removed from this element. If

Ext.enableNestedListenerRemoval is true, then DOM event listeners are also removed from all child

nodes. The body node will be ignored if passed in.

Available since: 2.3.0

Parameters

• node : HTMLElement

The node to remove

Extrequire( expressions, [fn], [scope], [excludes] )

Loads all classes by the given names and all their direct dependencies; optionally executes

the given callback function when finishes, within the optional scope.

require is alias for Ext.Loader.require.

Available since: 4.0.0

Parameters

• expressions : String/Array

Can either be a string or an array of string

• fn : Function (optional)

The callback function

• scope : Object (optional)

The execution scope (this) of the callback function

• excludes : String/Array (optional)

Classes to be excluded, useful when being used with expressions

ExtresolveMethod( fn, scope ) ★★★★ PRIVATE

Available since: Ext JS 4.2.1

Parameters

• fn : Object

• scope : Object

ExtresumeLayouts( flush )

Available since: 4.1.1

Parameters

• flush : Object

select( selector, [unique] ) : Ext.CompositeElement

Page 48 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 49: Ext Define

ExtShorthand of Ext.Element.select.

Available since: 1.1.0

Parameters

• selector : String

The CSS selector

• unique : Boolean (optional)

True to create a unique Ext.Element for each element. Defaults to a shared flyweight object.

Returns

• Ext.CompositeElement

The composite element

ExtsetGlyphFontFamily( fontFamily )

Sets the default font-family to use for components that support a glyph config.

Available since: 4.2.0

Parameters

• fontFamily : String

The name of the font-family

ExtsetVersion( packageName, version ) : Ext CHAINABLE

Set version number for the given package name.

Available since: 4.1.1

Parameters

• packageName : String

The package name, for example: 'core', 'touch', 'extjs'

• version : String/Ext.Version

The version, for example: '1.2.3alpha', '2.4.0-dev'

Returns

• Ext

Extsum( array ) : Number DEPRECATED

Old alias to Ext.Array.sum

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Page 49 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 50: Ext Define

Use Ext.Array.sum instead

Parameters

• array : Array

The Array to calculate the sum value of.

Returns

• Number

The sum.

ExtsuspendLayouts( )

Available since: 4.1.1

ExtsyncRequire( expressions, [fn], [scope], [excludes] )

Synchronously loads all classes by the given names and all their direct dependencies;

optionally executes the given callback function when finishes, within the optional scope.

syncRequire is alias for Ext.Loader.syncRequire.

Available since: 4.0.0

Parameters

• expressions : String/Array

Can either be a string or an array of string

• fn : Function (optional)

The callback function

• scope : Object (optional)

The execution scope (this) of the callback function

• excludes : String/Array (optional)

Classes to be excluded, useful when being used with expressions

ExttoArray( iterable, [start], [end] ) : Array

Converts any iterable (numeric indices and a length property) into a true array.

function test() {

var args = Ext.Array.toArray(arguments),

fromSecondToLastArgs = Ext.Array.toArray(arguments, 1);

alert(args.join(' '));

alert(fromSecondToLastArgs.join(' '));

}

test('just', 'testing', 'here'); // alerts 'just testing here';

// alerts 'testing here';

Page 50 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 51: Ext Define

Ext.Array.toArray(document.getElementsByTagName('div')); // will convert the NodeList into an array

Ext.Array.toArray('splitted'); // returns ['s', 'p', 'l', 'i', 't', 't', 'e', 'd']

Ext.Array.toArray('splitted', 0, 3); // returns ['s', 'p', 'l']

Ext.toArray is alias for Ext.Array.toArray

Available since: 3.4.0

Parameters

• iterable : Object

the iterable object to be turned into a true Array.

• start : Number (optional)

a zero-based index that specifies the start of extraction. Defaults to 0

• end : Number (optional)

a 1-based index that specifies the end of extraction. Defaults to the last index of the iterable value

Returns

• Array

array

ExttoSentence( items, connector ) : String DEPRECATED

Turns an array into a sentence, joined by a specified connector - e.g.:

Ext.toSentence(['Adama', 'Tigh', 'Roslin']); //'Adama, Tigh and Roslin'

Ext.toSentence(['Adama', 'Tigh', 'Roslin'], 'or'); //'Adama, Tigh or Roslin'

Available since: 4.0.0

This method has been DEPRECATED since 4.0.0

Will be removed in the next major version

Parameters

• items : String[]

The array to create a sentence from

• connector : String

The string to use to connect the last two words. Usually 'and' or 'or' - defaults to 'and'.

Returns

• String

The sentence string

Page 51 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 52: Ext Define

Exttype( value ) : String DEPRECATED

Old alias to typeOf

Available since: 1.1.0

This method has been DEPRECATED since 4.0.0

Use typeOf instead

Parameters

• value : Object

Returns

• String

ExttypeOf( value ) : String

Returns the type of the given variable in string format. List of possible values are:

• undefined: If the given value is undefined

• null: If the given value is null

• string: If the given value is a string

• number: If the given value is a number

• boolean: If the given value is a boolean value

• date: If the given value is a Date object

• function: If the given value is a function reference

• object: If the given value is an object

• array: If the given value is an array

• regexp: If the given value is a regular expression

• element: If the given value is a DOM Element

• textnode: If the given value is a DOM text node and contains something other than whitespace

• whitespace: If the given value is a DOM text node and contains only whitespace

Available since: 4.0.0

Parameters

• value : Object

Returns

• String

Extun( eventName, fn, [scope] )

Shorthand for the Ext.util.Observable.removeListener method of the globalEvents

Observable instance.

Available since: 4.2.0

Parameters

• eventName : String

The type of event the handler was associated with.

Page 52 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 53: Ext Define

• fn : Function

The handler to remove. This must be a reference to the function passed into the addListener

call.

• scope : Object (optional)

The scope originally specified for the handler. It must be the same as the scope argument

specified in the original call to addListener or the listener will not be removed.

Extunique( array ) : Array DEPRECATED

Old alias to Ext.Array.unique

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Use Ext.Array.unique instead

Parameters

• array : Array

Returns

• Array

results

ExturlAppend( url, string ) : String DEPRECATED

Old alias to Ext.String.urlAppend

Available since: 3.4.0

This method has been DEPRECATED

Use Ext.String.urlAppend instead

Parameters

• url : String

The URL to append to.

• string : String

The content to append to the URL.

Returns

• String

The resulting URL

ExturlDecode( queryString, [recursive] ) : Object DEPRECATED

Alias for Ext.Object.fromQueryString.

Page 53 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 54: Ext Define

Available since: 1.1.0

This method has been DEPRECATED since 4.0.0

Use Ext.Object.fromQueryString instead

Parameters

• queryString : String

The query string to decode

• recursive : Boolean (optional)

Whether or not to recursively decode the string. This format is supported by PHP / Ruby on Rails

servers and similar.

Defaults to: false

Returns

• Object

ExturlEncode( object, [recursive] ) : String DEPRECATED

Takes an object and converts it to an encoded query string.

Non-recursive:

Ext.Object.toQueryString({foo: 1, bar: 2}); // returns "foo=1&bar=2"

Ext.Object.toQueryString({foo: null, bar: 2}); // returns "foo=&bar=2"

Ext.Object.toQueryString({'some price': '0'}); // returns "some%20price=%24300"

Ext.Object.toQueryString({date: new Date(2011, 0, 1)}); // returns "date=%222011-01-01T00%3A00%3A00%22"

Ext.Object.toQueryString({colors: ['red', 'green', 'blue']}); // returns "colors=red&colors=green&colors=blue"

Recursive:

Ext.Object.toQueryString({

username: 'Jacky',

dateOfBirth: {

day: 1,

month: 2,

year: 1911

},

hobbies: ['coding', 'eating', 'sleeping', ['nested', 'stuff']]

}, true); // returns the following string (broken down and url-decoded for ease of reading purpose):

// username=Jacky

// &dateOfBirth[day]=1&dateOfBirth[month]=2&dateOfBirth[year]=1911

// &hobbies[0]=coding&hobbies[1]=eating&hobbies[2]=sleeping&hobbies[3][0]=nested&hobbies[3][1]=stuff

Available since: 1.1.0

Page 54 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 55: Ext Define

This method has been DEPRECATED since 4.0.0

Use Ext.Object.toQueryString instead

Parameters

• object : Object

The object to encode

• recursive : Boolean (optional)

Whether or not to interpret the object in recursive format. (PHP / Ruby on Rails servers and

similar).

Defaults to: false

Returns

• String

queryString

Extvalue( value, defaultValue, [allowBlank] ) : Object DEPRECATED

Utility method for returning a default value if the passed value is empty.

The value is deemed to be empty if it is:

• null

• undefined

• an empty array

• a zero length string (Unless the allowBlank parameter is true)

Available since: 2.3.0

This method has been DEPRECATED since 4.0.0

Use valueFrom instead

Parameters

• value : Object

The value to test

• defaultValue : Object

The value to return if the original value is empty

• allowBlank : Boolean (optional)

true to allow zero length strings to qualify as non-empty.

Defaults to: false

Returns

• Object

value, if non-empty, else defaultValue

Page 55 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 56: Ext Define

ExtvalueFrom( value, defaultValue, [allowBlank] ) : Object

Returns the given value itself if it's not empty, as described in isEmpty; returns the default

value (second argument) otherwise.

Available since: 4.0.0

Parameters

• value : Object

The value to test

• defaultValue : Object

The value to return if the original value is empty

• allowBlank : Boolean (optional)

true to allow zero length strings to qualify as non-empty (defaults to false)

Returns

• Object

value, if non-empty, else defaultValue

Extwidget( [name], [config] ) : Object

Convenient shorthand to create a widget by its xtype or a config object. See also

Ext.ClassManager.instantiateByAlias.

var button = Ext.widget('button'); // Equivalent to Ext.create('widget.button');

var panel = Ext.widget('panel', { // Equivalent to Ext.create('widget.panel')

title: 'Panel'

});

var grid = Ext.widget({

xtype: 'grid',

...

});

If a component instance is passed, it is simply returned.

Available since: 4.0.0

Parameters

• name : String (optional)

The xtype of the widget to create.

• config : Object (optional)

The configuration object for the widget constructor.

Returns

Page 56 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext

Page 57: Ext Define

• Object

The widget instance

Extzip( arr, [zipper] ) : Array DEPRECATED

Zips N sets together.

Example 1:

Ext.zip([1,2,3],[4,5,6]); // [[1,4],[2,5],[3,6]]

Example 2:

Ext.zip(

[ "+", "-", "+"],

[ 12, 10, 22],

[ 43, 15, 96],

function(a, b, c){

return "$" + a + "" + b + "." + c

}

); // ["$+12.43", "$-10.15", "$+22.96"]

Available since: 3.4.0

This method has been DEPRECATED since 4.0.0

Will be removed in the next major version

Parameters

• arr : Array/NodeList...

This argument may be repeated. Array(s) to contribute values.

• zipper : Function (optional)

The last item in the argument list. This will drive how the items are zipped together.

Returns

• Array

The zipped set.

Page 57 of 57Ext - Ext JS 4.2.1 - Sencha Docs

2/28/2014http://docs.sencha.com/extjs/4.2.1/?print=/api/Ext


Recommended