X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/25ef3491bd9ae007ff1fc2b0d7943e6eaaccf775..6e39d509471fe9b4e2660e0d1631b350d0c66f40:/docs/output/Ext.form.FieldSet.html?ds=sidebyside diff --git a/docs/output/Ext.form.FieldSet.html b/docs/output/Ext.form.FieldSet.html index 0291a2e2..2dee0431 100644 --- a/docs/output/Ext.form.FieldSet.html +++ b/docs/output/Ext.form.FieldSet.html @@ -1,4 +1,4 @@ -
Properties Methods Events Config Options Direct Link 
Observable
  Component
    BoxComponent
      Container
        Panel
          FieldSet

Class Ext.form.FieldSet

Package:Ext.form
Defined In:FieldSet.js
Class:FieldSet
Extends:Panel
xtype:fieldset
Standard container used for grouping items within a form. +
Observable
  Component
    BoxComponent
      Container
        Panel
          FieldSet

Class Ext.form.FieldSet

Package:Ext.form
Defined In:FieldSet.js
Class:FieldSet
Extends:Panel
Standard container used for grouping items within a form. 
var form = new Ext.FormPanel({
     title: 'Simple Form with FieldSets',
     labelWidth: 75, // label settings here cascade unless overridden

@@ -57,8 +57,8 @@ based layout manager, for example:
    
 
  • specifying layout: 'anchor' // or 'form', or 'absolute'
    • 
 

 
See Ext.layout.AnchorLayout.anchor also.
Component animCollapse : Boolean
true to animate the transition when the panel is collapsed, false to skip the -animation (defaults to false).
FieldSet autoDestroy : Boolean
If true the container will automatically destroy any contained component that is removed from it, else -destruction m...
If true the container will automatically destroy any contained component that is removed from it, else +animation (defaults to false).
FieldSet autoDestroy : Boolean
If true the container will automatically destroy any contained component that is removed from it, else +destruction mu...
If true the container will automatically destroy any contained component that is removed from it, else destruction must be handled manually (defaults to true).
Container autoHeight : Boolean
true to use height:'auto', false to use fixed height (defaults to false). Note: Setting autoHeight: true means that t...
true to use height:'auto', false to use fixed height (defaults to false). Note: Setting autoHeight: true means that the browser will manage the panel's height @@ -70,9 +70,9 @@ If autoLoad is not null, the panel will attempt ...
A val If autoLoad is not null, the panel will attempt to load its contents immediately upon render.

The URL will become the default URL for this panel's body element, -so it may be refreshed at any time.

Panel autoScroll : Boolean
true to use overflow:'auto' on the panel's body element and show scroll bars automatically when -necessary, false to c...
true to use overflow:'auto' on the panel's body element and show scroll bars automatically when -necessary, false to clip any overflowing content (defaults to false).
Panel autoShow : Boolean
True if the component should check for hidden classes (e.g. 'x-hidden' or 'x-hide-display') and remove +so it may be refreshed at any time.

Panel autoScroll : Boolean
true to use overflow:'auto' on the components layout element and show scroll bars automatically when +necessary, false...
true to use overflow:'auto' on the components layout element and show scroll bars automatically when +necessary, false to clip any overflowing content (defaults to false).
BoxComponent autoShow : Boolean
True if the component should check for hidden classes (e.g. 'x-hidden' or 'x-hide-display') and remove them on render...
True if the component should check for hidden classes (e.g. 'x-hidden' or 'x-hide-display') and remove them on render (defaults to false).
Component autoWidth : Boolean
True to use width:'auto', false to use fixed width (or allow it to be managed by its parent Container's layout manage...

True to use width:'auto', false to use fixed width (or allow it to be managed by its parent @@ -158,8 +158,18 @@ styling applied.

Additional css class selector to be applied to the body element in the format expected by Ext.Element.addClass (defaults to null). See bodyCfg.
Panel bodyStyle : String/Object/Function
Custom CSS styles to be applied to the body element in the format expected by Ext.Element.applyStyles (defaults to nu...
Custom CSS styles to be applied to the body element in the format expected by -Ext.Element.applyStyles (defaults to null). See bodyCfg.
Panel bubbleEvents : Array

An array of events that, when fired, should be bubbled to any parent container. -Defaults to ['add', 'remove'].

Container buttonAlign : String
The alignment of any buttons added to this panel. Valid values are 'right', +Ext.Element.applyStyles (defaults to null). See bodyCfg.
Panel boxMaxHeight : Number
The maximum value in pixels which this BoxComponent will set its height to. +Warning: This will override any size mana...

The maximum value in pixels which this BoxComponent will set its height to.

+

Warning: This will override any size management applied by layout managers.

BoxComponent boxMaxWidth : Number
The maximum value in pixels which this BoxComponent will set its width to. +Warning: This will override any size manag...

The maximum value in pixels which this BoxComponent will set its width to.

+

Warning: This will override any size management applied by layout managers.

BoxComponent boxMinHeight : Number
The minimum value in pixels which this BoxComponent will set its height to. +Warning: This will override any size mana...

The minimum value in pixels which this BoxComponent will set its height to.

+

Warning: This will override any size management applied by layout managers.

BoxComponent boxMinWidth : Number
The minimum value in pixels which this BoxComponent will set its width to. +Warning: This will override any size manag...

The minimum value in pixels which this BoxComponent will set its width to.

+

Warning: This will override any size management applied by layout managers.

BoxComponent bubbleEvents : Array
An array of events that, when fired, should be bubbled to any parent container. +See Ext.util.Observable.enableBubble....

An array of events that, when fired, should be bubbled to any parent container. +See Ext.util.Observable.enableBubble. +Defaults to ['add', 'remove'].

Container buttonAlign : String
The alignment of any buttons added to this panel. Valid values are 'right', 'left' and 'center' (defaults to 'right'...
The alignment of any buttons added to this panel. Valid values are 'right', 'left' and 'center' (defaults to 'right').
Panel buttons : Array
buttons will be used as items for the toolbar in the footer (fbar). Typically the value of this configuration propert...
buttons will be used as items for the toolbar in @@ -193,24 +203,21 @@ useful for adding customized styles to the component or any of its children usin 'x-panel-collapsed').
Panel collapsible : Boolean
true to make the fieldset collapsible and have the expand/collapse toggle button automatically rendered into the leg...
true to make the fieldset collapsible and have the expand/collapse toggle button automatically rendered into the legend element, false to keep the fieldset statically sized with no collapse -button (defaults to false). Another option is to configure checkboxToggle.
FieldSet contentEl : String
Optional. Specify an existing HTML element, or the id of an existing HTML element to use as this Panel's -body content...

Optional. Specify an existing HTML element, or the id of an existing HTML element to use as this Panel's -body content.

+button (defaults to false). Another option is to configure checkboxToggle.
FieldSet contentEl : String
Optional. Specify an existing HTML element, or the id of an existing HTML element to use as the content +for this comp...

Optional. Specify an existing HTML element, or the id of an existing HTML element to use as the content +for this component.

  • Description : -
    This config option is used to take an existing HTML element and place it in the body -of a new panel (it simply moves the specified DOM element into the body element of the Panel -after the Panel is rendered to use as the content (it is not going to be the actual panel itself).
    • +
    This config option is used to take an existing HTML element and place it in the layout element +of a new component (it simply moves the specified DOM element after the Component is rendered to use as the content.
  • Notes : -
    The specified HTML element is appended to the Panel's body Element by the -Panel's afterRender method after any configured HTML has -been inserted, and so the document will not contain this element at the time the -render event is fired.
    +
    The specified HTML element is appended to the layout element of the component after any configured +HTML has been inserted, and so the document will not contain this element at the time the render event is fired.
    The specified HTML element used will not participate in any layout -scheme that the Panel may use. It is just HTML. Layouts operate on child items.
    +scheme that the Component may use. It is just HTML. Layouts operate on child items.
Add either the x-hidden or the x-hide-display CSS class to prevent a brief flicker of the content before it is rendered to the panel.
-
Panel ctCls : String
An optional extra CSS class that will be added to this component's container. This can be useful for +
Component ctCls : String
An optional extra CSS class that will be added to this component's container. This can be useful for adding customize...

An optional extra CSS class that will be added to this component's container. This can be useful for adding customized styles to the container or any of its children using standard CSS rules. See Ext.layout.ContainerLayout.extraCls also.

@@ -221,26 +228,31 @@ which assigns a value by default:
To configure the above Class with an extra CSS class append to the default. For example, for BoxLayout (Hbox and Vbox):
ctCls: 'x-box-layout-ct custom-class'
-

Component defaults : Object
A config object that will be applied to all components added to this container either via the items -config or via th...

A config object that will be applied to all components added to this container either via the items -config or via the add or insert methods. The defaults config can contain any -number of name/value property pairs to be added to each item, and should be valid for the types of items -being added to the container. For example, to automatically apply padding to the body of each of a set of -contained Ext.Panel items, you could pass: defaults: {bodyStyle:'padding:15px'}.


-

Note: defaults will not be applied to config objects if the option is already specified. -For example:

defaults: {               // defaults are applied to items, not the container

-    autoScroll:true
-},
-items: [
-    {
-        xtype: 'panel',   // defaults do not have precedence over

-        id: 'panel1',     // options in config objects, so the defaults

-        autoScroll: false // will not be applied here, panel1 will be autoScroll:false

-    },
-    new Ext.Panel({       // defaults do have precedence over options

-        id: 'panel2',     // options in components, so the defaults

-        autoScroll: false // will be applied here, panel2 will be autoScroll:true.

-    })
+
Component data : Mixed
The initial set of data to apply to the tpl to +update the content area of the Component.
Component defaults : Object|Function
This option is a means of applying default settings to all added items whether added through the items +config or via ...

This option is a means of applying default settings to all added items whether added through the items +config or via the add or insert methods.

+

If an added item is a config object, and not an instantiated Component, then the default properties are +unconditionally applied. If the added item is an instantiated Component, then the default properties are +applied conditionally so as not to override existing properties in the item.

+

If the defaults option is specified as a function, then the function will be called using this Container as the +scope (this reference) and passing the added item as the first parameter. Any resulting object +from that call is then applied to the item as default properties.

+

For example, to automatically apply padding to the body of each of a set of +contained Ext.Panel items, you could pass: defaults: {bodyStyle:'padding:15px'}.

+

Usage:

defaults: {               // defaults are applied to items, not the container
+    autoScroll:true
+},
+items: [
+    {
+        xtype: 'panel',   // defaults do not have precedence over
+        id: 'panel1',     // options in config objects, so the defaults
+        autoScroll: false // will not be applied here, panel1 will be autoScroll:false
+    },
+    new Ext.Panel({       // defaults do have precedence over options
+        id: 'panel2',     // options in components, so the defaults
+        autoScroll: false // will be applied here, panel2 will be autoScroll:true.
+    })
 ]
Container disabled : Boolean
Render this panel disabled (default is false). An important note when using the disabled config on panels is that IE ...
Render this panel disabled (default is false). An important note when using the disabled config on panels is that IE will often fail to initialize the disabled mask element correectly if @@ -341,15 +353,15 @@ Example use:
new Ext.FormPanel({
     }]
 });
Component footerCfg : Object
A DomHelper element specification object specifying the element structure of this Panel's footer Element. See bodyCf...

A DomHelper element specification object specifying the element structure -of this Panel's footer Element. See bodyCfg also.

Panel forceLayout : Boolean
If true the container will force a layout initially even if hidden or collapsed. This option -is useful for forcing f...
If true the container will force a layout initially even if hidden or collapsed. This option +of this Panel's footer Element. See bodyCfg also.

Panel forceLayout : Boolean
If true the container will force a layout initially even if hidden or collapsed. This option +is useful for forcing fo...
If true the container will force a layout initially even if hidden or collapsed. This option is useful for forcing forms to render in collapsed or hidden containers. (defaults to false).
Container headerCfg : Object
A DomHelper element specification object specifying the element structure of this Panel's header Element. See bodyCf...

A DomHelper element specification object specifying the element structure of this Panel's header Element. See bodyCfg also.

Panel height : Number
The height of this component in pixels (defaults to auto). Note to express this dimension as a percentage or offset s...
The height of this component in pixels (defaults to auto). Note to express this dimension as a percentage or offset see Ext.Component.anchor.
BoxComponent hidden : Boolean
Render this component hidden (default is false). If true, the -hide method will be called internally.
Component hideBorders : Boolean
True to hide the borders of each contained component, false to defer to the component's existing -border settings (de...
True to hide the borders of each contained component, false to defer to the component's existing +hide method will be called internally.
Component hideBorders : Boolean
True to hide the borders of each contained component, false to defer to the component's existing +border settings (def...
True to hide the borders of each contained component, false to defer to the component's existing border settings (defaults to false).
Container hideLabel : Boolean
true to completely hide the label element (label and separator). Defaults to false. By default, even if you do not sp...

true to completely hide the label element @@ -374,11 +386,11 @@ since items are automatically laid out when they are first shown (no sizing is done while hidden).

Component hideParent : Boolean
True to hide and show the component's container when hide/show is called on the component, false to hide and show the...
True to hide and show the component's container when hide/show is called on the component, false to hide and show the component itself (defaults to false). For example, this can be used as a shortcut for a hide -button on a window by setting hide:true on the button when adding it to its parent container.
Component html : String/Object
An HTML fragment, or a DomHelper specification to use as the panel's body -content (defaults to ''). The HTML content ...
An HTML fragment, or a DomHelper specification to use as the panel's body -content (defaults to ''). The HTML content is added by the Panel's afterRender method, -and so the document will not contain this HTML at the time the render event is fired. -This content is inserted into the body before any configured contentEl is appended.
Panel id : String
The unique id of this component (defaults to an auto-assigned id). +button on a window by setting hide:true on the button when adding it to its parent container.
Component html : String/Object
An HTML fragment, or a DomHelper specification to use as the layout element +content (defaults to ''). The HTML conten...
An HTML fragment, or a DomHelper specification to use as the layout element +content (defaults to ''). The HTML content is added after the component is rendered, +so the document will not contain this HTML at the time the render event is fired. +This content is inserted into the body before any configured contentEl is appended.
Component id : String
The unique id of this component (defaults to an auto-assigned id). You should assign an id if you need to be able to ...

The unique id of this component (defaults to an auto-assigned id). You should assign an id if you need to be able to access the component later and you do not have an object reference available (e.g., using Ext.getCmp).

@@ -421,39 +433,39 @@ avoiding potential conflicts with getComponent('p1'); // not the same as Ext.getCmp() p2 = p1.ownerCt.getComponent('p2'); // reference via a sibling

Also see id and ref.

-

Note: to access the container of an item see ownerCt.

Component items : Object/Array
** IMPORTANT: be sure to specify a layout if needed ! ** -A single item, or an array of child Components to be added ...
** IMPORTANT: be sure to specify a layout if needed ! **
-

A single item, or an array of child Components to be added to this container, -for example:

-
// specifying a single item

-items: {...},
-layout: 'fit',    // specify a layout!

-
-// specifying multiple items

-items: [{...}, {...}],
-layout: 'anchor', // specify a layout!
-

Each item may be:

-
    -
  • any type of object based on Ext.Component
    • -
  • a fully instanciated object or
    • -
  • an object literal that:
    • -
      -
    • has a specified xtype
      • -
    • the Ext.Component.xtype specified is associated with the Component -desired and should be chosen from one of the available xtypes as listed -in Ext.Component.
      • -
    • If an xtype is not explicitly -specified, the defaultType for that Container is used.
      • -
    • will be "lazily instanciated", avoiding the overhead of constructing a fully -instanciated Component object
      • -
-

Notes:

-
    -
  • Ext uses lazy rendering. Child Components will only be rendered -should it become necessary. Items are automatically laid out when they are first -shown (no sizing is done while hidden), or in response to a doLayout call.
    • -
  • Do not specify contentEl/ -html with items.
    • +

    Note: to access the container of an item see ownerCt.

Component items : Object/Array
** IMPORTANT: be sure to specify a layout if needed ! ** +A single item, or an array of child Components to be added t...
** IMPORTANT: be sure to specify a layout if needed ! **
+

A single item, or an array of child Components to be added to this container, +for example:

+
// specifying a single item
+items: {...},
+layout: 'fit',    // specify a layout!
+
+// specifying multiple items
+items: [{...}, {...}],
+layout: 'anchor', // specify a layout!
+

Each item may be:

+
    +
  • any type of object based on Ext.Component
    • +
  • a fully instanciated object or
    • +
  • an object literal that:
    • +
      +
    • has a specified xtype
      • +
    • the Ext.Component.xtype specified is associated with the Component +desired and should be chosen from one of the available xtypes as listed +in Ext.Component.
      • +
    • If an xtype is not explicitly +specified, the defaultType for that Container is used.
      • +
    • will be "lazily instanciated", avoiding the overhead of constructing a fully +instanciated Component object
      • +
+

Notes:

+
    +
  • Ext uses lazy rendering. Child Components will only be rendered +should it become necessary. Items are automatically laid out when they are first +shown (no sizing is done while hidden), or in response to a doLayout call.
    • +
  • Do not specify contentEl/ +html with items.
Container keys : Object/Array
A Ext.KeyMap config object (in the format expected by Ext.KeyMap.addBinding used to assign custom key handling to thi...
A Ext.KeyMap config object (in the format expected by Ext.KeyMap.addBinding used to assign custom key handling to this panel (defaults to null).
Panel labelSeparator : String
The separator to display after the text of each @@ -500,11 +512,9 @@ Example use:
new Ext.FormPanel({
         fieldLabel: 'Name',
         labelStyle: 'font-weight:bold;'
     }]
-});
Component labelWidth : Number
The width of labels. This property cascades to child containers.
FieldSet layout : String
The Ext.Container.layout to use inside the fieldset (defaults to 'form').
FieldSet layoutConfig : Object
This is a config object containing properties specific to the chosen -layout if layout -has been specified as a strin...
This is a config object containing properties specific to the chosen -layout if layout -has been specified as a string.

Container listeners : Object
A config object containing one or more event handlers to be added to this +});
Component labelWidth : Number
The width of labels. This property cascades to child containers.
FieldSet layout : String
The Ext.Container.layout to use inside the fieldset (defaults to 'form').
FieldSet layoutConfig : Object
This is a config object containing properties specific to the chosen +layout if layout +has been specified as a string.

Container listeners : Object
A config object containing one or more event handlers to be added to this object during initialization. This should ...

A config object containing one or more event handlers to be added to this object during initialization. This should be a valid listeners config object as specified in the addListener example for attaching multiple handlers at once.

@@ -584,13 +594,16 @@ to the second, and the bottom is set to the third. to true). Either way, the panel will alwa...
true to mask the panel when it is disabled, false to not mask it (defaults to true). Either way, the panel will always tell its contained elements to disable themselves when it is disabled, but masking the panel can provide an additional visual cue that the panel is -disabled.
Panel minButtonWidth : Number
Minimum width in pixels of all buttons in this panel (defaults to 75)
Panel monitorResize : Boolean
True to automatically monitor window resize events to handle anything that is sensitive to the current size -of the v...
True to automatically monitor window resize events to handle anything that is sensitive to the current size -of the viewport. This value is typically managed by the chosen layout and should not need +disabled.
Panel minButtonWidth : Number
Minimum width in pixels of all buttons in this panel (defaults to 75)
Panel monitorResize : Boolean
True to automatically monitor window resize events to handle anything that is sensitive to the current size +of the vi...
True to automatically monitor window resize events to handle anything that is sensitive to the current size +of the viewport. This value is typically managed by the chosen layout and should not need to be set manually.
Container overCls : String
An optional extra CSS class that will be added to this component's Element when the mouse moves over the Element, and...
An optional extra CSS class that will be added to this component's Element when the mouse moves over the Element, and removed when the mouse moves out. (defaults to ''). This can be -useful for adding customized 'active' or 'hover' styles to the component or any of its children using standard CSS rules.
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 plugins : Object/Array
An object or array of objects that will provide custom functionality for this component. The only +useful for adding customized 'active' or 'hover' styles to the component or any of its children using standard CSS rules.
Component padding : Number/String
A shortcut for setting a padding style on the body element. The value can either be +a number to be applied to all sid...
A shortcut for setting a padding style on the body element. The value can either be +a number to be applied to all sides, or a normal css string describing padding. +Defaults to undefined.
Panel 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 plugins : Object/Array
An object or array of objects that will provide custom functionality for this component. The only requirement for a ...
An object or array of objects that will provide custom functionality for this component. The only requirement for a valid plugin is that it contain an init method that accepts a reference of type Ext.Component. When a component is created, if any plugins are available, the component will call the init method on each @@ -608,9 +621,9 @@ object. The ptype will be looked up at render time up to determine type of Plugin to create.

If you create your own Plugins, you may register them using Ext.ComponentMgr.registerPlugin in order to be able to -take advantage of lazy instantiation and rendering.
Component ref : String
A path specification, relative to the Component's ownerCt specifying into which -ancestor Container to place a named r...

A path specification, relative to the Component's ownerCt specifying into which -ancestor Container to place a named reference to this Component.

+take advantage of lazy instantiation and rendering.
Component ref : String
A path specification, relative to the Component's ownerCt +specifying into which ancestor Container to place a named r...

A path specification, relative to the Component's ownerCt +specifying into which ancestor Container to place a named reference to this Component.

The ancestor axis can be traversed by using '/' characters in the path. For example, to put a reference to a Toolbar Button into the Panel which owns the Toolbar:

var myGrid = new Ext.grid.EditorGridPanel({
     title: 'My EditorGridPanel',
@@ -629,9 +642,10 @@ For example, to put a reference to a Toolbar Button into the Panel which owns
         }
     }
 });
-

In the code above, if the ref had been 'saveButton' the reference would -have been placed into the Toolbar. Each '/' in the ref moves up one level from the -Component's ownerCt.

Component region : String
Note: this config is only used when this BoxComponent is rendered +

In the code above, if the ref had been 'saveButton' +the reference would have been placed into the Toolbar. Each '/' in the ref +moves up one level from the Component's ownerCt.

+

Also see the added and removed events.

Component region : String
Note: this config is only used when this BoxComponent is rendered by a Container which has been configured to use the...

Note: this config is only used when this BoxComponent is rendered by a Container which has been configured to use the BorderLayout layout manager (e.g. specifying layout:'border').


@@ -735,7 +749,16 @@ by clicking anywhere in the header bar, fa...
true< by clicking anywhere in the header bar, false) to allow it only by clicking to tool button (defaults to false)). If this panel is a child item of a border layout also see the BorderLayout.Region -floatable config option.
Panel unstyled : Boolean
Overrides the baseCls setting to baseCls = 'x-plain' which renders +floatable config option.
Panel tpl : Mixed
An Ext.Template, Ext.XTemplate +or an array of strings to form an Ext.XTemplate. +Used in conjunction with the data and...
An Ext.Template, Ext.XTemplate +or an array of strings to form an Ext.XTemplate. +Used in conjunction with the data and +tplWriteMode configurations.
Component tplWriteMode : String
The Ext.(X)Template method to use when +updating the content area of the Component. Defaults to 'overwrite' +(see Ext.X...
The Ext.(X)Template method to use when +updating the content area of the Component. Defaults to 'overwrite' +(see Ext.XTemplate.overwrite).
Component unstyled : Boolean
Overrides the baseCls setting to baseCls = 'x-plain' which renders the panel unstyled except for required attributes ...
Overrides the baseCls setting to baseCls = 'x-plain' which renders the panel unstyled except for required attributes for Ext layouts to function (e.g. overflow:hidden).
Panel width : Number
The width of this component in pixels (defaults to auto). Note to express this dimension as a percentage or offset se...
The width of this component in pixels (defaults to auto). @@ -774,41 +797,43 @@ config for a suggestion, or use a render listener directly:

new
 
See also getEl
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 ownerCt : Ext.Container
This Component's owner Container (defaults to undefined, and is set automatically when this Component is added to a C...
This Component's owner Container (defaults to undefined, and is set automatically when this Component is added to a Container). Read-only. -

Note: to access items within the Container see itemId.

Component rendered : Boolean
True if this component has been rendered. Read-only.
Component

Public Methods

MethodDefined By
 rendered : Boolean
True if this component has been rendered. Read-only.
Component

Public Methods

MethodDefined By

Public Events

EventDefined By