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     this.addEvents({
  24         /**
  25          * @event close
  26          * Fires after the click the close btn
  27              * @param {Roo.form.DisplayField} this
  28              */
  29         close : true
  30     });
  31 };
  32
  33 Roo.extend(Roo.form.DisplayField, Roo.form.TextField,  {
  34     inputType:      'hidden',
  35     allowBlank:     true,
  36     readOnly:         true,
  37
  38
  39     /**
  40      * @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to undefined)
  41      */
  42     focusClass : undefined,
  43     /**
  44      * @cfg {String} fieldClass The default CSS class for the checkbox (defaults to "x-form-field")
  45      */
  46     fieldClass: 'x-form-field',
  47
  48      /**
  49      * @cfg {Function} valueRenderer The renderer for the field (so you can reformat output). should return raw HTML
  50      */
  51     valueRenderer: undefined,
  52
  53     width: 100,
  54     /**
  55      * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
  56      * {tag: "input", type: "checkbox", autocomplete: "off"})
  57      */
  58
  59  //   defaultAutoCreate : { tag: 'input', type: 'hidden', autocomplete: 'off'},
  60
  61     closable : false,
  62
  63     onResize : function(){
  64         Roo.form.DisplayField.superclass.onResize.apply(this, arguments);
  65
  66     },
  67
  68     initEvents : function(){
  69         // Roo.form.Checkbox.superclass.initEvents.call(this);
  70         // has no events...
  71
  72         if(this.closable){
  73             this.closeEl.on('click', this.onClose, this);
  74         }
  75
  76     },
  77
  78
  79     getResizeEl : function(){
  80         return this.wrap;
  81     },
  82
  83     getPositionEl : function(){
  84         return this.wrap;
  85     },
  86
  87     // private
  88     onRender : function(ct, position){
  89
  90         Roo.form.DisplayField.superclass.onRender.call(this, ct, position);
  91         //if(this.inputValue !== undefined){
  92         this.wrap = this.el.wrap();
  93
  94         this.viewEl = this.wrap.createChild({ tag: 'div', cls: 'x-form-displayfield'});
  95
  96         if(this.closable){
  97             this.closeEl = this.wrap.createChild({ tag: 'div', cls: 'x-dlg-close'});
  98         }
  99
 100         if (this.bodyStyle) {
 101             this.viewEl.applyStyles(this.bodyStyle);
 102         }
 103         //this.viewEl.setStyle('padding', '2px');
 104
 105         this.setValue(this.value);
 106
 107     },
 108 /*
 109     // private
 110     initValue : Roo.emptyFn,
 111
 112   */
 113
 114         // private
 115     onClick : function(){
 116
 117     },
 118
 119     /**
 120      * Sets the checked state of the checkbox.
 121      * @param {Boolean/String} checked True, 'true', '1', or 'on' to check the checkbox, any other value will uncheck it.
 122      */
 123     setValue : function(v){
 124         this.value = v;
 125         var html = this.valueRenderer ?  this.valueRenderer(v) : String.format('{0}', v);
 126         // this might be called before we have a dom element..
 127         if (!this.viewEl) {
 128             return;
 129         }
 130         this.viewEl.dom.innerHTML = html;
 131         Roo.form.DisplayField.superclass.setValue.call(this, v);
 132
 133     },
 134
 135     onClose : function(e)
 136     {
 137         e.preventDefault();
 138
 139         this.fireEvent('close', this);
 140     }
 141 });