3 This file is part of Ext JS 4
5 Copyright (c) 2011 Sencha Inc
7 Contact: http://www.sencha.com/contact
9 GNU General Public License Usage
10 This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file. Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.
12 If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.
16 * @class Ext.form.field.Display
17 * @extends Ext.form.field.Base
18 * <p>A display-only text field which is not validated and not submitted. This is useful for when you want
19 * to display a value from a form's {@link Ext.form.Basic#load loaded data} but do not want to allow the
20 * user to edit or submit that value. The value can be optionally {@link #htmlEncode HTML encoded} if it contains
21 * HTML markup that you do not want to be rendered.</p>
22 * <p>If you have more complex content, or need to include components within the displayed content, also
23 * consider using a {@link Ext.form.FieldContainer} instead.</p>
24 * {@img Ext.form.Display/Ext.form.Display.png Ext.form.Display component}
27 Ext.create('Ext.form.Panel', {
33 xtype: 'displayfield',
38 xtype: 'displayfield',
39 fieldLabel: 'Visitor',
40 name: 'visitor_score',
46 renderTo: Ext.getBody()
50 Ext.define('Ext.form.field.Display', {
51 extend:'Ext.form.field.Base',
52 alias: 'widget.displayfield',
53 requires: ['Ext.util.Format', 'Ext.XTemplate'],
54 alternateClassName: ['Ext.form.DisplayField', 'Ext.form.Display'],
56 '<div id="{id}" class="{fieldCls}"></div>',
64 * @cfg {String} fieldCls The default CSS class for the field (defaults to <tt>"x-form-display-field"</tt>)
66 fieldCls: Ext.baseCSSPrefix + 'form-display-field',
69 * @cfg {Boolean} htmlEncode <tt>false</tt> to skip HTML-encoding the text when rendering it (defaults to
70 * <tt>false</tt>). This might be useful if you want to include tags in the field's innerHTML rather than
71 * rendering them as string literals per the default logic.
75 validateOnChange: false,
77 initEvents: Ext.emptyFn,
85 validate: function() {
89 getRawValue: function() {
93 setRawValue: function(value) {
95 value = Ext.value(value, '');
98 me.inputEl.dom.innerHTML = me.htmlEncode ? Ext.util.Format.htmlEncode(value) : value;
104 getContentTarget: function() {
109 * @cfg {String} inputType
113 * @cfg {Boolean} disabled
117 * @cfg {Boolean} readOnly
121 * @cfg {Boolean} validateOnChange
125 * @cfg {Number} checkChangeEvents
129 * @cfg {Number} checkChangeBuffer