allow string based values for comboboxarray
[roojs1] / Roo / form / DisplayField.js
index 2e59886..96d7cc8 100644 (file)
  * @class Roo.form.DisplayField
  * @extends Roo.form.Field
  * A generic Field to display non-editable data.
+ * @cfg {Boolean} closable (true|false) default false
  * @constructor
  * Creates a new Display Field item.
  * @param {Object} config Configuration options
  */
-Roo.form.DisplayText = function(config){
-    Roo.form.DisplayText.superclass.constructor.call(this, config);
+Roo.form.DisplayField = function(config){
+    Roo.form.DisplayField.superclass.constructor.call(this, config);
     
+    this.addEvents({
+        /**
+         * @event close
+         * Fires after the click the close btn
+            * @param {Roo.form.DisplayField} this
+            */
+        close : true
+    });
 };
 
-Roo.extend(Roo.form.DisplayText, Roo.form.Field,  {
+Roo.extend(Roo.form.DisplayField, Roo.form.TextField,  {
+    inputType:      'hidden',
+    allowBlank:     true,
+    readOnly:         true,
+    
     /**
      * @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to undefined)
      */
@@ -32,25 +46,32 @@ Roo.extend(Roo.form.DisplayText, Roo.form.Field,  {
     fieldClass: 'x-form-field',
     
      /**
-     * @cfg {Function} renderer The renderer for the field (so you can reformat output). should return raw HTML
+     * @cfg {Function} valueRenderer The renderer for the field (so you can reformat output). should return raw HTML
      */
-    renderer: undefined,
+    valueRenderer: undefined,
     
+    width: 100,
     /**
      * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
      * {tag: "input", type: "checkbox", autocomplete: "off"})
      */
      
-    defaultAutoCreate : { tag: 'input', type: 'hidden', autocomplete: 'off'},
-
+ //   defaultAutoCreate : { tag: 'input', type: 'hidden', autocomplete: 'off'},
+    closable : false,
+    
     onResize : function(){
-        Roo.form.Field.superclass.onResize.apply(this, arguments);
+        Roo.form.DisplayField.superclass.onResize.apply(this, arguments);
         
     },
 
     initEvents : function(){
         // Roo.form.Checkbox.superclass.initEvents.call(this);
         // has no events...
+        
+        if(this.closable){
+            this.closeEl.on('click', this.onClose, this);
+        }
        
     },
 
@@ -65,12 +86,16 @@ Roo.extend(Roo.form.DisplayText, Roo.form.Field,  {
 
     // private
     onRender : function(ct, position){
-        Roo.form.DisplayText.superclass.onRender.call(this, ct, position);
+        
+        Roo.form.DisplayField.superclass.onRender.call(this, ct, position);
         //if(this.inputValue !== undefined){
+        this.wrap = this.el.wrap();
         
+        this.viewEl = this.wrap.createChild({ tag: 'div', cls: 'x-form-displayfield'});
         
-        this.wrap = this.el.wrap();
-        this.viewEl = this.wrap.createChild({ tag: 'div'});
+        if(this.closable){
+            this.closeEl = this.wrap.createChild({ tag: 'div', cls: 'x-dlg-close'});
+        }
         
         if (this.bodyStyle) {
             this.viewEl.applyStyles(this.bodyStyle);
@@ -80,11 +105,11 @@ Roo.extend(Roo.form.DisplayText, Roo.form.Field,  {
         this.setValue(this.value);
         
     },
-
+/*
     // private
     initValue : Roo.emptyFn,
 
-  
+  */
 
        // private
     onClick : function(){
@@ -97,9 +122,20 @@ Roo.extend(Roo.form.DisplayText, Roo.form.Field,  {
      */
     setValue : function(v){
         this.value = v;
-        var html = this.renderer ?  this.renderer(v) : String.format('{0}', v);
+        var html = this.valueRenderer ?  this.valueRenderer(v) : String.format('{0}', v);
+        // this might be called before we have a dom element..
+        if (!this.viewEl) {
+            return;
+        }
         this.viewEl.dom.innerHTML = html;
-        Roo.form.DisplayText.superclass.setValue.call(this, v);
+        Roo.form.DisplayField.superclass.setValue.call(this, v);
 
+    },
+    
+    onClose : function(e)
+    {
+        e.preventDefault();
+        
+        this.fireEvent('close', this);
     }
 });
\ No newline at end of file