X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/d41dc04ad17d1d9125fb2cf72db2b4782dbe3a8c..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/docs/output/Ext.Container.html diff --git a/docs/output/Ext.Container.html b/docs/output/Ext.Container.html deleted file mode 100644 index fb4029bc..00000000 --- a/docs/output/Ext.Container.html +++ /dev/null @@ -1,2386 +0,0 @@ -
-
- Properties - Methods - Events - Config Options - Direct Link -
-
-
Observable
-  Component
-    BoxComponent
-      Container
-

Class Ext.Container

- - - - - - -
Package:Ext
Defined In:Container.js
Class:Container
Subclasses:Panel, Viewport
Extends:BoxComponent
-
- * -

Base class for any Ext.BoxComponent that can contain other components. The most commonly -used Container classes are Ext.Panel, Ext.Window and Ext.TabPanel, but you can -create a lightweight Container to encapsulate an HTML element that is created to your -specifications at render time by using the autoEl config option -which takes the form of a DomHelper specification. If you do not need -the capabilities offered by the above mentioned classes, for instance embedded -column layouts inside FormPanels, then this is a useful technique.

-

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

var embeddedColumns = new Ext.Container({
-    autoEl: {},
-    layout: 'column',
-    defaults: {
-        xtype: 'container',
-        autoEl: {},
-        layout: 'form',
-        columnWidth: 0.5,
-        style: {
-            padding: '10px'
-        }
-    },
-    items: [{
-        items: {
-            xtype: 'datefield',
-            name: 'startDate',
-            fieldLabel: 'Start date'
-        }
-    }, {
-        items: {
-            xtype: 'datefield',
-            name: 'endDate',
-            fieldLabel: 'End date'
-        }
-    }]
-});

-Containers handle the basic behavior of containing items, namely adding, inserting and removing them. -The specific layout logic required to visually render contained items is delegated to any one of the different -layout classes available.

-

When either specifying child items of a Container, or dynamically adding components to a Container, -remember to consider how you wish the Container to arrange those child elements, and whether those child elements -need to be sized using one of Ext's built-in layout schemes.

-

By default, Containers use the ContainerLayout scheme. This simply renders -child components, appending them one after the other inside the Container, and does not apply any sizing at all. -This is a common source of confusion when widgets like GridPanels or TreePanels are added to Containers for -which no layout has been specified. If a Container is left to use the ContainerLayout scheme, none of its child -components will be resized, or changed in any way when the Container is resized.

-

A very common example of this is where a developer will attempt to add a GridPanel to a TabPanel by wrapping -the GridPanel inside a wrapping Panel and add that wrapping Panel to the TabPanel. This misses the point that -Ext's inheritance means that a GridPanel is a Component which can be added unadorned into a Container. If -that wrapping Panel has no layout configuration, then the GridPanel will not be sized as expected.

-

Below is an example of adding a newly created GridPanel to a TabPanel. A TabPanel uses Ext.layout.CardLayout -as its layout manager which means all its child items are sized to fit exactly into its client area. The following -code requires prior knowledge of how to create GridPanels. See Ext.grid.GridPanel, Ext.data.Store -and Ext.data.JsonReader as well as the grid examples in the Ext installation's examples/grid -directory.

//  Create the GridPanel.
-myGrid = new Ext.grid.GridPanel({
-    store: myStore,
-    columns: myColumnModel,
-    title: 'Results',
-});
-
-myTabPanel.add(myGrid);
-myTabPanel.setActiveTab(myGrid);
- -
- -

Config Options

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Config OptionsDefined By
  - - allowDomMove : Boolean
- Whether the component can move the Dom node when rendering (defaults to true).
- 		Component
  - - disabled : Boolean
- Render this component disabled (default is false).
- 		Component
  - - disabledClass : String
- CSS class added to the component when it is disabled (defaults to "x-item-disabled").
- 		Component
  - - height : Number
- The height of this component in pixels (defaults to auto).
- 		BoxComponent
  - - hidden : Boolean
- Render this component hidden (default is false).
- 		Component
  - - pageX : Number
- The page level x coordinate for this component if contained within a positioning container.
- 		BoxComponent
  - - pageY : Number
- The page level y coordinate for this component if contained within a positioning container.
- 		BoxComponent
  - - width : Number
- The width of this component in pixels (defaults to auto).
- 		BoxComponent
  - - x : Number
- The local x (left) coordinate for this component if contained within a positioning container.
- 		BoxComponent
  - - y : Number
- The local y (top) coordinate for this component if contained within a positioning container.
- 		BoxComponent
- -

Public Properties

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefined By
  - - disabled : Boolean
- True if this component is disabled. Read-only.
- 		Component
  - - 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
- -
\ No newline at end of file