git.roojs.org Git - roojs1/blob - docs/src/Roo_form_Row.js.html

   1 <html><head><title>Roo/form/Row.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty">
   2 <span class="jsdoc-comment">/**
   3  * @class Roo.form.Row
   4  * @extends Roo.form.Layout
   5  * @children Roo.form.Column Roo.form.Row Roo.form.Field Roo.Button Roo.form.TextItem Roo.form.FieldSet
   6  * Creates a row container for layout and rendering of fields in an {@link Roo.form.Form}.
   7  * @constructor
   8  * @param {Object} config Configuration options
   9  */
  10
  11
  12 </span><span class="jsdoc-var">Roo.form.Row </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">){
  13     </span><span class="jsdoc-var">Roo.form.Row.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">);
  14 };
  15
  16 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.form.Row</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.form.Layout</span><span class="jsdoc-syntax">, {
  17       </span><span class="jsdoc-comment">/**
  18      * @cfg {Number/String} width
  19      * The fixed width of the column in pixels or CSS value (defaults to &quot;auto&quot;)
  20      */
  21     /**
  22      * @cfg {Number/String} height
  23      * The fixed height of the column in pixels or CSS value (defaults to &quot;auto&quot;)
  24      */
  25     </span><span class="jsdoc-var">defaultAutoCreate </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-ct x-form-row'</span><span class="jsdoc-syntax">},
  26
  27     </span><span class="jsdoc-var">padWidth </span><span class="jsdoc-syntax">: 20,
  28     </span><span class="jsdoc-comment">// private
  29     </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">){
  30         </span><span class="jsdoc-comment">//console.log('row render');
  31         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.rowTpl</span><span class="jsdoc-syntax">){
  32             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.Template</span><span class="jsdoc-syntax">(
  33                 </span><span class="jsdoc-string">'&lt;div class=&quot;x-form-item {5}&quot; style=&quot;float:left;width:{6}px&quot;&gt;'</span><span class="jsdoc-syntax">,
  34                     </span><span class="jsdoc-string">'&lt;label for=&quot;{0}&quot; style=&quot;{2}&quot;&gt;{1}{4}&lt;/label&gt;'</span><span class="jsdoc-syntax">,
  35                     </span><span class="jsdoc-string">'&lt;div class=&quot;x-form-element&quot; id=&quot;x-form-el-{0}&quot; style=&quot;{3}&quot;&gt;'</span><span class="jsdoc-syntax">,
  36                     </span><span class="jsdoc-string">'&lt;/div&gt;'</span><span class="jsdoc-syntax">,
  37                 </span><span class="jsdoc-string">'&lt;/div&gt;'
  38             </span><span class="jsdoc-syntax">);
  39             </span><span class="jsdoc-var">t.disableFormats </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
  40             </span><span class="jsdoc-var">t.compile</span><span class="jsdoc-syntax">();
  41             </span><span class="jsdoc-var">Roo.form.Layout.prototype.rowTpl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">;
  42         }
  43         </span><span class="jsdoc-var">this.fieldTpl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.rowTpl</span><span class="jsdoc-syntax">;
  44
  45         </span><span class="jsdoc-comment">//console.log('lw' + this.labelWidth +', la:' + this.labelAlign);
  46         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">labelWidth </span><span class="jsdoc-syntax">= 100;
  47
  48         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.labelAlign </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">)) {
  49             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">this.labelWidth </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'number'</span><span class="jsdoc-syntax">) {
  50                 </span><span class="jsdoc-var">labelWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.labelWidth
  51             </span><span class="jsdoc-syntax">}
  52             </span><span class="jsdoc-var">this.padWidth </span><span class="jsdoc-syntax">=  20 + </span><span class="jsdoc-var">labelWidth</span><span class="jsdoc-syntax">;
  53
  54         }
  55
  56         </span><span class="jsdoc-var">Roo.form.Column.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">);
  57         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.width</span><span class="jsdoc-syntax">){
  58             </span><span class="jsdoc-var">this.el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.width</span><span class="jsdoc-syntax">);
  59         }
  60         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.height</span><span class="jsdoc-syntax">){
  61             </span><span class="jsdoc-var">this.el.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.height</span><span class="jsdoc-syntax">);
  62         }
  63     },
  64
  65     </span><span class="jsdoc-comment">// private
  66     </span><span class="jsdoc-var">renderField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">){
  67         </span><span class="jsdoc-var">f.fieldEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.fieldTpl.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">, [
  68                </span><span class="jsdoc-var">f.id</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">f.fieldLabel</span><span class="jsdoc-syntax">,
  69                </span><span class="jsdoc-var">f.labelStyle</span><span class="jsdoc-syntax">||</span><span class="jsdoc-var">this.labelStyle</span><span class="jsdoc-syntax">||</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  70                </span><span class="jsdoc-var">this.elementStyle</span><span class="jsdoc-syntax">||</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  71                </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">f.labelSeparator </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.labelSeparator </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">f.labelSeparator</span><span class="jsdoc-syntax">,
  72                </span><span class="jsdoc-var">f.itemCls</span><span class="jsdoc-syntax">||</span><span class="jsdoc-var">this.itemCls</span><span class="jsdoc-syntax">||</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  73                </span><span class="jsdoc-var">f.width </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">f.width </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.padWidth </span><span class="jsdoc-syntax">: 160 + </span><span class="jsdoc-var">this.padWidth
  74        </span><span class="jsdoc-syntax">],</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
  75     }
  76 });
  77
  78 </span></code></body></html>