/**
 * @class Ext.form.field.Display
 * @extends Ext.form.field.Base
 * <p>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.</p>
 * <p>If you have more complex content, or need to include components within the displayed content, also
 * consider using a {@link Ext.form.FieldContainer} instead.</p>
 * {@img Ext.form.Display/Ext.form.Display.png Ext.form.Display component}
 * <p>Example:</p>
 * <pre><code>
    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()
    });
</code></pre>

 * @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
: [
       
'<div id="{id}" class="{fieldCls}"></div>',
       
{
            compiled
: true,
            disableFormats
: true
       
}
   
],

    /**
     * @cfg {String} fieldCls The default CSS class for the field (defaults to <tt>"x-form-display-field"</tt>)
     */

    fieldCls
: Ext.baseCSSPrefix + 'form-display-field',

    /**
     * @cfg {Boolean} htmlEncode <tt>false</tt> to skip HTML-encoding the text when rendering it (defaults to
     * <tt>false</tt>). 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;
   
}

    /**
     * @cfg {String} inputType
     * @hide
     */

    /**
     * @cfg {Boolean} disabled
     * @hide
     */

    /**
     * @cfg {Boolean} readOnly
     * @hide
     */

    /**
     * @cfg {Boolean} validateOnChange
     * @hide
     */

    /**
     * @cfg {Number} checkChangeEvents
     * @hide
     */

    /**
     * @cfg {Number} checkChangeBuffer
     * @hide
     */

});