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>
|