git.roojs.org Git - roojs1/blob - Roo/form/DisplayField.js

   1 /*
   2  * Based on:
   3  * Ext JS Library 1.1.1
   4  * Copyright(c) 2006-2007, Ext JS, LLC.
   5  *
   6  * Originally Released Under LGPL - original licence link has changed is not relivant.
   7  *
   8  * Fork - LGPL
   9  * <script type="text/javascript">
  10  */
  11 /**
  12  * @class Roo.form.DisplayField
  13  * @extends Roo.form.Field
  14  * A generic Field to display non-editable data.
  15  * @cfg {Boolean} closable (true|false) default false
  16  * @constructor
  17  * Creates a new Display Field item.
  18  * @param {Object} config Configuration options
  19  */
  20 Roo.form.DisplayField = function(config){
  21     Roo.form.DisplayField.superclass.constructor.call(this, config);
  22
  23 };
  24
  25 Roo.extend(Roo.form.DisplayField, Roo.form.TextField,  {
  26     inputType:      'hidden',
  27     allowBlank:     true,
  28     readOnly:         true,
  29
  30
  31     /**
  32      * @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to undefined)
  33      */
  34     focusClass : undefined,
  35     /**
  36      * @cfg {String} fieldClass The default CSS class for the checkbox (defaults to "x-form-field")
  37      */
  38     fieldClass: 'x-form-field',
  39
  40      /**
  41      * @cfg {Function} valueRenderer The renderer for the field (so you can reformat output). should return raw HTML
  42      */
  43     valueRenderer: undefined,
  44
  45     width: 100,
  46     /**
  47      * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
  48      * {tag: "input", type: "checkbox", autocomplete: "off"})
  49      */
  50
  51  //   defaultAutoCreate : { tag: 'input', type: 'hidden', autocomplete: 'off'},
  52
  53     closable : false,
  54
  55     onResize : function(){
  56         Roo.form.DisplayField.superclass.onResize.apply(this, arguments);
  57
  58     },
  59
  60     initEvents : function(){
  61         // Roo.form.Checkbox.superclass.initEvents.call(this);
  62         // has no events...
  63
  64         if(this.closable){
  65             this.closeEl.on('click', this.onClose, this);
  66         }
  67
  68     },
  69
  70
  71     getResizeEl : function(){
  72         return this.wrap;
  73     },
  74
  75     getPositionEl : function(){
  76         return this.wrap;
  77     },
  78
  79     // private
  80     onRender : function(ct, position){
  81
  82         Roo.form.DisplayField.superclass.onRender.call(this, ct, position);
  83         //if(this.inputValue !== undefined){
  84         this.wrap = this.el.wrap();
  85
  86         this.viewEl = this.wrap.createChild({ tag: 'div', cls: 'x-form-displayfield'});
  87
  88         if(this.closable){
  89             this.closeEl = this.wrap.createChild({ tag: 'div', cls: 'x-dlg-close'});
  90         }
  91
  92         if (this.bodyStyle) {
  93             this.viewEl.applyStyles(this.bodyStyle);
  94         }
  95         //this.viewEl.setStyle('padding', '2px');
  96
  97         this.setValue(this.value);
  98
  99     },
 100 /*
 101     // private
 102     initValue : Roo.emptyFn,
 103
 104   */
 105
 106         // private
 107     onClick : function(){
 108
 109     },
 110
 111     /**
 112      * Sets the checked state of the checkbox.
 113      * @param {Boolean/String} checked True, 'true', '1', or 'on' to check the checkbox, any other value will uncheck it.
 114      */
 115     setValue : function(v){
 116         this.value = v;
 117         var html = this.valueRenderer ?  this.valueRenderer(v) : String.format('{0}', v);
 118         // this might be called before we have a dom element..
 119         if (!this.viewEl) {
 120             return;
 121         }
 122         this.viewEl.dom.innerHTML = html;
 123         Roo.form.DisplayField.superclass.setValue.call(this, v);
 124
 125     }
 126 });