Upgrade to ExtJS 4.0.0 - Released 04/26/2011
[extjs.git] / docs / source / Display.html
diff --git a/docs/source/Display.html b/docs/source/Display.html
new file mode 100644 (file)
index 0000000..d9d407f
--- /dev/null
@@ -0,0 +1,125 @@
+<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-form.field.Display-method-constructor'><span id='Ext-form.field.Display'>/**
+</span></span> * @class Ext.form.field.Display
+ * @extends Ext.form.field.Base
+ * &lt;p&gt;A display-only text field which is not validated and not submitted. This is useful for when you want
+ * to display a value from a form's {@link Ext.form.Basic#load loaded data} but do not want to allow the
+ * user to edit or submit that value. The value can be optionally {@link #htmlEncode HTML encoded} if it contains
+ * HTML markup that you do not want to be rendered.&lt;/p&gt;
+ * &lt;p&gt;If you have more complex content, or need to include components within the displayed content, also
+ * consider using a {@link Ext.form.FieldContainer} instead.&lt;/p&gt;
+ * {@img Ext.form.Display/Ext.form.Display.png Ext.form.Display component}
+ * &lt;p&gt;Example:&lt;/p&gt;
+ * &lt;pre&gt;&lt;code&gt;
+    Ext.create('Ext.form.Panel', {
+        width: 175,
+        height: 120,
+        bodyPadding: 10,
+        title: 'Final Score',
+        items: [{
+            xtype: 'displayfield',
+            fieldLabel: 'Home',
+            name: 'home_score',
+            value: '10'
+        }, {
+            xtype: 'displayfield',
+            fieldLabel: 'Visitor',
+            name: 'visitor_score',
+            value: '11'
+        }],
+        buttons: [{
+            text: 'Update',
+        }],
+        renderTo: Ext.getBody()
+    });
+&lt;/code&gt;&lt;/pre&gt;
+
+ * @constructor
+ * Creates a new DisplayField.
+ * @param {Object} config Configuration options
+ *
+ * @xtype displayfield
+ */
+Ext.define('Ext.form.field.Display', {
+    extend:'Ext.form.field.Base',
+    alias: 'widget.displayfield',
+    requires: ['Ext.util.Format', 'Ext.XTemplate'],
+    alternateClassName: ['Ext.form.DisplayField', 'Ext.form.Display'],
+    fieldSubTpl: [
+        '&lt;div id=&quot;{id}&quot; class=&quot;{fieldCls}&quot;&gt;&lt;/div&gt;',
+        {
+            compiled: true,
+            disableFormats: true
+        }
+    ],
+
+<span id='Ext-form.field.Display-cfg-fieldCls'>    /**
+</span>     * @cfg {String} fieldCls The default CSS class for the field (defaults to &lt;tt&gt;&quot;x-form-display-field&quot;&lt;/tt&gt;)
+     */
+    fieldCls: Ext.baseCSSPrefix + 'form-display-field',
+
+<span id='Ext-form.field.Display-cfg-htmlEncode'>    /**
+</span>     * @cfg {Boolean} htmlEncode &lt;tt&gt;false&lt;/tt&gt; to skip HTML-encoding the text when rendering it (defaults to
+     * &lt;tt&gt;false&lt;/tt&gt;). This might be useful if you want to include tags in the field's innerHTML rather than
+     * rendering them as string literals per the default logic.
+     */
+    htmlEncode: false,
+
+    validateOnChange: false,
+
+    initEvents: Ext.emptyFn,
+
+    submitValue: false,
+
+    isValid: function() {
+        return true;
+    },
+
+    validate: function() {
+        return true;
+    },
+
+    getRawValue: function() {
+        return this.rawValue;
+    },
+
+    setRawValue: function(value) {
+        var me = this;
+        value = Ext.value(value, '');
+        me.rawValue = value;
+        if (me.rendered) {
+            me.inputEl.dom.innerHTML = me.htmlEncode ? Ext.util.Format.htmlEncode(value) : value;
+        }
+        return value;
+    },
+
+    // private
+    getContentTarget: function() {
+        return this.inputEl;
+    }
+
+<span id='Ext-form.field.Display-cfg-inputType'>    /**
+</span>     * @cfg {String} inputType
+     * @hide
+     */
+<span id='Ext-form.field.Display-cfg-disabled'>    /**
+</span>     * @cfg {Boolean} disabled
+     * @hide
+     */
+<span id='Ext-form.field.Display-cfg-readOnly'>    /**
+</span>     * @cfg {Boolean} readOnly
+     * @hide
+     */
+<span id='Ext-form.field.Display-cfg-validateOnChange'>    /**
+</span>     * @cfg {Boolean} validateOnChange
+     * @hide
+     */
+<span id='Ext-form.field.Display-cfg-checkChangeEvents'>    /**
+</span>     * @cfg {Number} checkChangeEvents
+     * @hide
+     */
+<span id='Ext-form.field.Display-cfg-checkChangeBuffer'>    /**
+</span>     * @cfg {Number} checkChangeBuffer
+     * @hide
+     */
+});
+</pre></pre></body></html>
\ No newline at end of file