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