X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/docs/api/Ext.form.Labelable.html diff --git a/docs/api/Ext.form.Labelable.html b/docs/api/Ext.form.Labelable.html new file mode 100644 index 00000000..7650f82d --- /dev/null +++ b/docs/api/Ext.form.Labelable.html @@ -0,0 +1,248 @@ +Ext.form.Labelable | Ext JS 4.0 Documentation +
For up to date documentation and features, visit +http://docs.sencha.com/ext-js/4-0

Sencha Documentation

+ + + + + +

A mixin which allows a component to be configured and decorated with a label and/or error message as is +common for form fields. This is used by e.g. Ext.form.field.Base and Ext.form.FieldContainer +to let them be managed by the Field layout.

+ +

*NOTE**: This mixin is mainly for internal library use and most users should not need to use it directly. It +is more likely you will want to use one of the component classes that import this mixin, such as +Ext.form.field.Base or Ext.form.FieldContainer.

+ +

Use of this mixin does not make a component a field in the logical sense, meaning it does not provide any +logic or state related to values or validation; that is handled by the related Ext.form.field.Field +mixin. These two mixins may be used separately (for example Ext.form.FieldContainer is Labelable but not a +Field), or in combination (for example Ext.form.field.Base implements both and has logic for connecting the +two.)

+ +

Component classes which use this mixin should use the Field layout +or a derivation thereof to properly size and position the label and message according to the component config. +They must also call the initLabelable method during component initialization to ensure the mixin gets +set up correctly.

+
Defined By

Config Options

CSS Class configs

 

The CSS class to be applied to the body content element. Defaults to 'x-form-item-body'.

+

The CSS class to be applied to the body content element. Defaults to 'x-form-item-body'.

+
 
The CSS class to be applied to the special clearing div rendered directly after the field +contents wrapper to provide...

The CSS class to be applied to the special clearing div rendered directly after the field +contents wrapper to provide field clearing (defaults to 'x-clear').

+
 

The CSS class to be applied to the error message element. Defaults to 'x-form-error-msg'.

+

The CSS class to be applied to the error message element. Defaults to 'x-form-error-msg'.

+
 

An extra CSS class to be applied to the body content element in addition to fieldBodyCls. +Defaults to empty.

+

An extra CSS class to be applied to the body content element in addition to fieldBodyCls. +Defaults to empty.

+
 
A CSS class to be applied to the outermost element to denote that it is participating in the form +field layout. Defau...

A CSS class to be applied to the outermost element to denote that it is participating in the form +field layout. Defaults to 'x-form-item'.

+
 

The CSS class to use when marking the component invalid (defaults to 'x-form-invalid')

+

The CSS class to use when marking the component invalid (defaults to 'x-form-invalid')

+
 

The CSS class to be applied to the label element. Defaults to 'x-form-item-label'.

+

The CSS class to be applied to the label element. Defaults to 'x-form-item-label'.

+

Other Configs

 
If specified, then the component will be displayed with this value as its active error when +first rendered. Defaults ...

If specified, then the component will be displayed with this value as its active error when +first rendered. Defaults to undefined. Use setActiveError or unsetActiveError to +change it after component creation.

+
 
The template used to format the Array of error messages passed to setActiveErrors +into a single HTML string. By defau...

The template used to format the Array of error messages passed to setActiveErrors +into a single HTML string. By default this renders each message as an item in an unordered list.

+
 

Whether to adjust the component's body area to make room for 'side' or 'under' +error messages. Defaults to true.

+

Whether to adjust the component's body area to make room for 'side' or 'under' +error messages. Defaults to true.

+
 

The CSS class to be applied to the body content element. Defaults to 'x-form-item-body'.

+

The CSS class to be applied to the body content element. Defaults to 'x-form-item-body'.

+
 
The CSS class to be applied to the special clearing div rendered directly after the field +contents wrapper to provide...

The CSS class to be applied to the special clearing div rendered directly after the field +contents wrapper to provide field clearing (defaults to 'x-clear').

+
 

The CSS class to be applied to the error message element. Defaults to 'x-form-error-msg'.

+

The CSS class to be applied to the error message element. Defaults to 'x-form-error-msg'.

+
 

An extra CSS class to be applied to the body content element in addition to fieldBodyCls. +Defaults to empty.

+

An extra CSS class to be applied to the body content element in addition to fieldBodyCls. +Defaults to empty.

+
 
The label for the field. It gets appended with the labelSeparator, and its position +and sizing is determined by the l...

The label for the field. It gets appended with the labelSeparator, and its position +and sizing is determined by the labelAlign, labelWidth, and labelPad +configs. Defaults to undefined.

+
 
A CSS class to be applied to the outermost element to denote that it is participating in the form +field layout. Defau...

A CSS class to be applied to the outermost element to denote that it is participating in the form +field layout. Defaults to 'x-form-item'.

+
 
When set to true, the label element (fieldLabel and labelSeparator) will be +automatically hidden if the fieldLabel is...

When set to true, the label element (fieldLabel and labelSeparator) will be +automatically hidden if the fieldLabel is empty. Setting this to false will cause the empty +label element to be rendered and space to be reserved for it; this is useful if you want a field without a label +to line up with other labeled fields in the same form. Defaults to true.

+ + +

If you wish to unconditionall hide the label even if a non-empty fieldLabel is configured, then set +the hideLabel config to true.

+ +
 
Set to true to completely hide the label element (fieldLabel and labelSeparator). +Defaults to false. + + +Also see hideE...

Set to true to completely hide the label element (fieldLabel and labelSeparator). +Defaults to false.

+ + +

Also see hideEmptyLabel, which controls whether space will be reserved for an empty fieldLabel.

+ +
 

The CSS class to use when marking the component invalid (defaults to 'x-form-invalid')

+

The CSS class to use when marking the component invalid (defaults to 'x-form-invalid')

+
 
Controls the position and alignment of the fieldLabel. Valid values are: + + + +"left" (the default) - The label is posit...

Controls the position and alignment of the fieldLabel. Valid values are:

+ + +
    +
  • "left" (the default) - The label is positioned to the left of the field, with its text +aligned to the left. Its width is determined by the labelWidth config.
  • +
  • "top" - The label is positioned above the field.
  • +
  • "right" - The label is positioned to the left of the field, with its text aligned +to the right. Its width is determined by the labelWidth config.
  • +
+ +
 

The CSS class to be applied to the label element. Defaults to 'x-form-item-label'.

+

The CSS class to be applied to the label element. Defaults to 'x-form-item-label'.

+
 

The amount of space in pixels between the fieldLabel and the input field. Defaults to 5.

+

The amount of space in pixels between the fieldLabel and the input field. Defaults to 5.

+
 

Character(s) to be inserted at the end of the label text.

+

Character(s) to be inserted at the end of the label text.

+
 

A CSS style specification string to apply directly to this field's label. Defaults to undefined.

+ +

A CSS style specification string to apply directly to this field's label. Defaults to undefined.

+ +
 

The width of the fieldLabel in pixels. Only applicable if the labelAlign is set +to "left" or "right". Defaults to 100.

+

The width of the fieldLabel in pixels. Only applicable if the labelAlign is set +to "left" or "right". Defaults to 100.

+
 
The rendering template for the field decorations. Component classes using this mixin should include +logic to use this...

The rendering template for the field decorations. Component classes using this mixin should include +logic to use this as their renderTpl, and implement the +getSubTplMarkup method to generate the field body content.

+
 
The location where the error message text should display. +Must be one of the following values: + + + +qtip Display a quic...

The location where the error message text should display. +Must be one of the following values:

+ + +
    +
  • qtip Display a quick tip containing the message when the user hovers over the field. This is the default. +
    Ext.tip.QuickTipManager.init must have been called for this setting to work.
  • +
  • title Display the message in a default browser title attribute popup.
  • +
  • under Add a block div beneath the field containing the error message.
  • +
  • side Add an error icon to the right of the field, displaying the message in a popup on hover.
  • +
  • none Don't display any error message. This might be useful if you are implementing custom error display.
  • +
  • [element id] Add the error message directly to the innerHTML of the specified element.
  • +
+ +
 

true to disable displaying any error message set on this object. +Defaults to false.

+

true to disable displaying any error message set on this object. +Defaults to false.

+
Defined By

Properties

 

The div Element wrapping the component's contents. Only available after the component has been rendered.

+

The div Element wrapping the component's contents. Only available after the component has been rendered.

+
 
The div Element that will contain the component's error message(s). Note that depending on the +configured msgTarget, ...

The div Element that will contain the component's error message(s). Note that depending on the +configured msgTarget, this element may be hidden in favor of some other form of +presentation, but will always be present in the DOM for use by assistive technologies.

+
 

Flag denoting that this object is labelable as a field. Always true.

+

Flag denoting that this object is labelable as a field. Always true.

+
 

The label Element for this component. Only available after the component has been rendered.

+

The label Element for this component. Only available after the component has been rendered.

+
Defined By

Methods

 
Gets the active error message for this component, if any. This does not trigger +validation on its own, it merely retu...

Gets the active error message for this component, if any. This does not trigger +validation on its own, it merely returns any message that the component may already hold.

+

Returns

  • String   

    The active error message on the component; if there is no error, an empty string is returned.

    +
 
Gets an Array of any active error messages currently applied to the field. This does not trigger +validation on its ow...

Gets an Array of any active error messages currently applied to the field. This does not trigger +validation on its own, it merely returns any messages that the component may already hold.

+

Returns

  • Array   

    The active error messages on the component; if there are no errors, an empty Array is returned.

    +
 

Returns the label for the field. Defaults to simply returning the fieldLabel config. Can be +overridden to provide

+

Returns the label for the field. Defaults to simply returning the fieldLabel config. Can be +overridden to provide

+

Returns

  • String   

    The configured field label, or empty string if not defined

    +
 
Get the input id, if any, for this component. This is used as the "for" attribute on the label element. +Implementing ...

Get the input id, if any, for this component. This is used as the "for" attribute on the label element. +Implementing subclasses may also use this as e.g. the id for their own input element.

+

Returns

  • String   

    The input id

    +
 
Tells whether the field currently has an active error message. This does not trigger +validation on its own, it merely...

Tells whether the field currently has an active error message. This does not trigger +validation on its own, it merely looks for any message that the component may already hold.

+

Returns

  • Boolean    +
 
Performs initialization of this mixin. Component classes using this mixin should call this method +during their own in...

Performs initialization of this mixin. Component classes using this mixin should call this method +during their own initialization.

+

Returns

  • void    +
 
Sets the active error message to the given string. This replaces the entire error message +contents with the given str...

Sets the active error message to the given string. This replaces the entire error message +contents with the given string. Also see setActiveErrors which accepts an Array of +messages and formats them according to the activeErrorsTpl.

+

Parameters

  • msg : String

    The error message

    +

Returns

  • void    +
 
Set the active error message to an Array of error messages. The messages are formatted into +a single message string u...

Set the active error message to an Array of error messages. The messages are formatted into +a single message string using the activeErrorsTpl. Also see setActiveError +which allows setting the entire error contents with a single string.

+

Parameters

  • errors : Array

    The error messages

    +

Returns

  • void    +
 
Applies a set of default configuration values to this Labelable instance. For each of the +properties in the given obj...

Applies a set of default configuration values to this Labelable instance. For each of the +properties in the given object, check if this component hasOwnProperty that config; if not +then it's inheriting a default value from its prototype and we should apply the default value.

+

Parameters

  • defaults : Object

    The defaults to apply to the object.

    +

Returns

  • void    +
 

Clears the active error.

+

Clears the active error.

+

Returns

  • void    +
Defined By

Events

 
errorchange( +Ext.form.Labelable this, String error) +

Fires when the active error message is changed via setActiveError.

+

Fires when the active error message is changed via setActiveError.

+

Parameters

  • this : Ext.form.Labelable
    +
  • error : String

    The active error message

    +
\ No newline at end of file