| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176 | <!DOCTYPE html><html><head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <title>The source code</title>  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>  <style type="text/css">    .highlight { display: block; background-color: #ddd; }  </style>  <script type="text/javascript">    function highlight() {      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";    }  </script></head><body onload="prettyPrint(); highlight();">  <pre class="prettyprint lang-js"><span id='Ext-form-field-Display'>/**</span> * 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. * * If you have more complex content, or need to include components within the displayed content, also consider using a * {@link Ext.form.FieldContainer} instead. * * Example: * *     @example *     Ext.create('Ext.form.Panel', { *         renderTo: Ext.getBody(), *         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' *         }] *     }); */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}"',        '<tpl if="fieldStyle"> style="{fieldStyle}"</tpl>',         ' class="{fieldCls}">{value}</div>',        {            compiled: true,            disableFormats: true        }    ],<span id='Ext-form-field-Display-cfg-fieldCls'>    /**</span>     * @cfg {String} [fieldCls="x-form-display-field"]     * The default CSS class for the field.     */    fieldCls: Ext.baseCSSPrefix + 'form-display-field',<span id='Ext-form-field-Display-cfg-htmlEncode'>    /**</span>     * @cfg {Boolean} htmlEncode     * True to escape HTML in text when rendering it.     */    htmlEncode: false,    <span id='Ext-form-field-Display-cfg-renderer'>    /**</span>     * @cfg {Function} renderer     * A function to transform the raw value for display in the field. The function will receive 2 arguments, the raw value     * and the {@link Ext.form.field.Display} object.     */    <span id='Ext-form-field-Display-cfg-scope'>    /**</span>     * @cfg {Object} scope     * The scope to execute the {@link #renderer} function. Defaults to this.     */    validateOnChange: false,    initEvents: Ext.emptyFn,    submitValue: false,        isDirty: function(){        return false;    },    isValid: function() {        return true;    },    validate: function() {        return true;    },    getRawValue: function() {        return this.rawValue;    },    setRawValue: function(value) {        var me = this,            display;                    value = Ext.value(value, '');        me.rawValue = value;        if (me.rendered) {            me.inputEl.dom.innerHTML = me.getDisplayValue();            me.updateLayout();        }        return value;    },<span id='Ext-form-field-Display-method-getDisplayValue'>    /**</span>     * @private     * Format the value to display.     */    getDisplayValue: function() {        var me = this,            value = this.getRawValue(),            display;        if (me.renderer) {             display = me.renderer.call(me.scope || me, value, me);        } else {             display = me.htmlEncode ? Ext.util.Format.htmlEncode(value) : value;        }        return display;    },            getSubTplData: function() {        var ret = this.callParent(arguments);        ret.value = this.getDisplayValue();        return ret;    }<span id='Ext-form-field-Display-cfg-inputType'>    /**</span>     * @cfg {String} inputType     * @private     */<span id='Ext-form-field-Display-cfg-disabled'>    /**</span>     * @cfg {Boolean} disabled     * @private     */<span id='Ext-form-field-Display-cfg-readOnly'>    /**</span>     * @cfg {Boolean} readOnly     * @private     */<span id='Ext-form-field-Display-cfg-validateOnChange'>    /**</span>     * @cfg {Boolean} validateOnChange     * @private     */<span id='Ext-form-field-Display-cfg-checkChangeEvents'>    /**</span>     * @cfg {Number} checkChangeEvents     * @private     */<span id='Ext-form-field-Display-cfg-checkChangeBuffer'>    /**</span>     * @cfg {Number} checkChangeBuffer     * @private     */});</pre></body></html>
 |