X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/c930e9176a5a85509c5b0230e2bff5c22a591432..refs/heads/old:/docs/output/Ext.Container.html?ds=sidebyside diff --git a/docs/output/Ext.Container.html b/docs/output/Ext.Container.html index b72b98e9..43e286a3 100644 --- a/docs/output/Ext.Container.html +++ b/docs/output/Ext.Container.html @@ -1,13 +1,16 @@ -
Properties Methods Events Config Options Direct Link
Observable
  Component
    BoxComponent
      Container

Class Ext.Container

Package:Ext
Defined In:Container.js
Class:Container
Subclasses:Panel, Toolbar, Viewport, Menu
Extends:BoxComponent
xtype:container

Base class for any Ext.BoxComponent that may contain other Components. Containers handle the +

Class Ext.Container

Package:Ext
Defined In:Container.js
Class:Container
Subclasses:Panel, Toolbar, Viewport, Menu
Extends:BoxComponent

Base class for any Ext.BoxComponent that may contain other Components. Containers handle the basic behavior of containing items, namely adding, inserting and removing items.

The most commonly used Container classes are Ext.Panel, Ext.Window and Ext.TabPanel. If you do not need the capabilities offered by the aforementioned classes you can create a lightweight Container to be encapsulated by an HTML element to your specifications by using the -autoEl config option. This is a useful technique when creating +autoEl config option. This is a useful technique when creating embedded column layouts inside FormPanels for example.

The code below illustrates both how to explicitly create a Container, and how to implicitly -create one using the 'container' xtype:

// explicitly create a Container
+create one using the 'container' xtype:
// explicitly create a Container
 var embeddedColumns = new Ext.Container({
     autoEl: 'div',  // This is the default
     layout: 'column',
@@ -50,7 +53,7 @@ renders child components, appending them one after the other inside the
 Container, and does not apply any sizing at all.

A common mistake is when a developer neglects to specify a layout (e.g. widgets like GridPanels or -TreePanels are added to Containers for which no layout +TreePanels are added to Containers for which no layout has been specified). If a Container is left to use the default ContainerLayout scheme, none of its child components will be resized, or changed in any way when the Container @@ -74,10 +77,10 @@ exactly into its client area.

Overnesting is a common problem. An example of overnesting occurs when a GridPanel is added to a TabPanel by wrapping the GridPanel inside a wrapping Panel (that has no -layout specified) and then add that wrapping Panel +layout specified) and then add that wrapping Panel to the TabPanel. The point to realize is that a GridPanel is a Component which can be added directly to a Container. If the wrapping Panel -has no layout configuration, then the overnested +has no layout configuration, then the overnested GridPanel will not be sized as expected.

Adding via remote configuration

A server side script can be used to add Components which are generated dynamically on the server. @@ -102,7 +105,7 @@ Ext.Ajax.request({ } });

The server script needs to return an executable Javascript statement which, when processed -using eval(), will return either a config object with an xtype, +using eval(), will return either a config object with an xtype, or an instantiated Component. The server might return this for example:

(function() {
     function formatDate(value){
         return value ? value.dateFormat('M d, Y') : '';
@@ -140,24 +143,24 @@ or an instantiated Component. The server might return this for example:

     store.load();
     return grid;  // return instantiated component
 })();
-

When the above code fragment is passed through the eval function in the success handler +

When the above code fragment is passed through the eval function in the success handler of the Ajax request, the code is executed by the Javascript processor, and the anonymous function runs, and returns the instantiated grid component.

-

Note: since the code above is generated by a server script, the baseParams for +

Note: since the code above is generated by a server script, the baseParams for the Store, the metadata to allow generation of the Record layout, and the ColumnModel can all be generated into the code since these are all known on the server.

Config Options

Config OptionsDefined By
 allowDomMove : Boolean
Whether the component can move the Dom node when rendering (defaults to true).
Component
 allowDomMove : Boolean
Whether the component can move the Dom node when rendering (defaults to true).
Component
 data : Mixed
The initial set of data to apply to the tpl to +update the content area of the Component.
Component
 layoutConfig : Object
This is a config object containing properties specific to the chosen layout if layout has been specified as a string.

Container
 resizeEvent : String
The event to listen to for resizing in layouts. Defaults to 'resize'.
Container
 x : Number
The local x (left) coordinate for this component if contained within a positioning container.
BoxComponent
 hidden : Boolean
True if this component is hidden. Read-only.
Component
 initialConfig : Object
This Component's initial configuration specification. Read-only.
Component
 items : MixedCollection
The collection of components in this container as a Ext.util.MixedCollection
Container
 rendered : Boolean
True if this component has been rendered. Read-only.
Component

Public Methods

MethodDefined By
 hidden : Boolean
True if this component is hidden. Read-only.
Component
 initialConfig : Object
This Component's initial configuration specification. Read-only.
Component
 items : MixedCollection
The collection of components in this container as a Ext.util.MixedCollection
Container
 rendered : Boolean
True if this component has been rendered. Read-only.
Component

Public Methods

MethodDefined By

Public Events

EventDefined By