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

   1 <html><head><title>/home/edward/gitlive/roojs1/Roo/form/ComboBoxArray.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  * Copyright(c) 2010-2012, Roo J Solutions Limited
   3  *
   4  * Licence LGPL
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.form.ComboBoxArray
  10  * @extends Roo.form.TextField
  11  * A facebook style adder... for lists of email / people / countries  etc...
  12  * pick multiple items from a combo box, and shows each one.
  13  *
  14  *  Fred [x]  Brian [x]  [Pick another |v]
  15  *
  16  *
  17  *  For this to work: it needs various extra information
  18  *    - normal combo problay has
  19  *      name, hiddenName
  20  *    + displayField, valueField
  21  *
  22  *    For our purpose...
  23  *
  24  *
  25  *   If we change from 'extends' to wrapping...
  26  *
  27  *
  28  *
  29
  30
  31  * @constructor
  32  * Create a new ComboBoxArray.
  33  * @param {Object} config Configuration options
  34  */
  35
  36
  37 </span><span class="jsdoc-var">Roo.form.ComboBoxArray </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">)
  38 {
  39     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
  40         </span><span class="jsdoc-comment">/**
  41          * @event beforeremove
  42          * Fires before remove the value from the list
  43              * @param {Roo.form.ComboBoxArray} _self This combo box array
  44              * @param {Roo.form.ComboBoxArray.Item} item removed item
  45              */
  46         </span><span class="jsdoc-string">'beforeremove' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  47         </span><span class="jsdoc-comment">/**
  48          * @event remove
  49          * Fires when remove the value from the list
  50              * @param {Roo.form.ComboBoxArray} _self This combo box array
  51              * @param {Roo.form.ComboBoxArray.Item} item removed item
  52              */
  53         </span><span class="jsdoc-string">'remove' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
  54
  55
  56     </span><span class="jsdoc-syntax">});
  57
  58     </span><span class="jsdoc-var">Roo.form.ComboBoxArray.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">);
  59
  60     </span><span class="jsdoc-var">this.items </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.MixedCollection</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
  61
  62     </span><span class="jsdoc-comment">// construct the child combo...
  63
  64
  65
  66
  67
  68
  69 </span><span class="jsdoc-syntax">}
  70
  71
  72 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.form.ComboBoxArray</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.form.TextField</span><span class="jsdoc-syntax">,
  73 {
  74     </span><span class="jsdoc-comment">/**
  75      * @cfg {Roo.form.Combo} combo The combo box that is wrapped
  76      */
  77
  78     </span><span class="jsdoc-var">lastData </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  79
  80     </span><span class="jsdoc-comment">// behavies liek a hiddne field
  81     </span><span class="jsdoc-var">inputType</span><span class="jsdoc-syntax">:      </span><span class="jsdoc-string">'hidden'</span><span class="jsdoc-syntax">,
  82     </span><span class="jsdoc-comment">/**
  83      * @cfg {Number} width The width of the box that displays the selected element
  84      */
  85     </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">:          300,
  86
  87
  88
  89     </span><span class="jsdoc-comment">/**
  90      * @cfg {String} name    The name of the visable items on this form (eg. titles not ids)
  91      */
  92     </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  93     </span><span class="jsdoc-comment">/**
  94      * @cfg {String} hiddenName    The hidden name of the field, often contains an comma seperated list of names
  95      */
  96     </span><span class="jsdoc-var">hiddenName </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  97
  98
  99     </span><span class="jsdoc-comment">// private the array of items that are displayed..
 100     </span><span class="jsdoc-var">items  </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 101     </span><span class="jsdoc-comment">// private - the hidden field el.
 102     </span><span class="jsdoc-var">hiddenEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 103     </span><span class="jsdoc-comment">// private - the filed el..
 104     </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 105
 106     </span><span class="jsdoc-comment">//validateValue : function() { return true; }, // all values are ok!
 107     //onAddClick: function() { },
 108
 109     </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">)
 110     {
 111
 112         </span><span class="jsdoc-comment">// create the standard hidden element
 113         //Roo.form.ComboBoxArray.superclass.onRender.call(this, ct, position);
 114
 115
 116         // give fake names to child combo;
 117         </span><span class="jsdoc-var">this.combo.hiddenName </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.hiddenName </span><span class="jsdoc-syntax">? (</span><span class="jsdoc-var">this.hiddenName</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'-subcombo'</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">this.hiddenName</span><span class="jsdoc-syntax">;
 118         </span><span class="jsdoc-var">this.combo.name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">? (</span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'-subcombo'</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">;
 119
 120         </span><span class="jsdoc-var">this.combo </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.combo</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.form</span><span class="jsdoc-syntax">);
 121         </span><span class="jsdoc-var">this.combo.onRender</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">);
 122         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.combo.width</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
 123             </span><span class="jsdoc-var">this.combo.onResize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.combo.width</span><span class="jsdoc-syntax">,0);
 124         }
 125
 126         </span><span class="jsdoc-var">this.combo.initEvents</span><span class="jsdoc-syntax">();
 127
 128         </span><span class="jsdoc-comment">// assigned so form know we need to do this..
 129         </span><span class="jsdoc-var">this.store          </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.store</span><span class="jsdoc-syntax">;
 130         </span><span class="jsdoc-var">this.valueField     </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.valueField</span><span class="jsdoc-syntax">;
 131         </span><span class="jsdoc-var">this.displayField   </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.displayField </span><span class="jsdoc-syntax">;
 132
 133
 134         </span><span class="jsdoc-var">this.combo.wrap.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'x-cbarray-grp'</span><span class="jsdoc-syntax">);
 135
 136         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cbwrap </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.wrap.createChild</span><span class="jsdoc-syntax">(
 137             {</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-cbarray-cb'</span><span class="jsdoc-syntax">},
 138             </span><span class="jsdoc-var">this.combo.el.dom
 139         </span><span class="jsdoc-syntax">);
 140
 141
 142         </span><span class="jsdoc-var">this.hiddenEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.wrap.createChild</span><span class="jsdoc-syntax">({
 143             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'hidden' </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.hiddenName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''
 144         </span><span class="jsdoc-syntax">});
 145         </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.wrap.createChild</span><span class="jsdoc-syntax">({
 146             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'hidden' </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''
 147         </span><span class="jsdoc-syntax">});
 148          </span><span class="jsdoc-comment">//   this.el.dom.removeAttribute(&quot;name&quot;);
 149
 150
 151         </span><span class="jsdoc-var">this.outerWrap </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.wrap</span><span class="jsdoc-syntax">;
 152         </span><span class="jsdoc-var">this.wrap </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cbwrap</span><span class="jsdoc-syntax">;
 153
 154         </span><span class="jsdoc-var">this.outerWrap.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.width</span><span class="jsdoc-syntax">);
 155         </span><span class="jsdoc-var">this.outerWrap.dom.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">);
 156
 157         </span><span class="jsdoc-var">this.wrap.dom.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">);
 158         </span><span class="jsdoc-var">this.outerWrap.dom.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.combo.trigger.dom</span><span class="jsdoc-syntax">);
 159         </span><span class="jsdoc-var">this.combo.wrap.dom.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.combo.trigger.dom</span><span class="jsdoc-syntax">);
 160
 161         </span><span class="jsdoc-var">this.combo.trigger.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'relative'</span><span class="jsdoc-syntax">);
 162         </span><span class="jsdoc-var">this.combo.trigger.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'0px'</span><span class="jsdoc-syntax">);
 163         </span><span class="jsdoc-var">this.combo.trigger.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'2px'</span><span class="jsdoc-syntax">);
 164
 165         </span><span class="jsdoc-var">this.combo.el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'vertical-align'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'text-bottom'</span><span class="jsdoc-syntax">);
 166
 167         </span><span class="jsdoc-comment">//this.trigger.setStyle('vertical-align', 'top');
 168
 169         // this should use the code from combo really... on('add' ....)
 170         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.adder</span><span class="jsdoc-syntax">) {
 171
 172
 173             </span><span class="jsdoc-var">this.adder </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.outerWrap.createChild</span><span class="jsdoc-syntax">(
 174                 {</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">src</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.BLANK_IMAGE_URL</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'x-form-adder'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'margin-left:2px'</span><span class="jsdoc-syntax">});
 175             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 176             </span><span class="jsdoc-var">this.adder.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</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">) {
 177                 </span><span class="jsdoc-var">_t.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'adderclick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 178             }, </span><span class="jsdoc-var">_t</span><span class="jsdoc-syntax">);
 179         }
 180         </span><span class="jsdoc-comment">//var _t = this;
 181         //this.adder.on('click', this.onAddClick, _t);
 182
 183
 184         </span><span class="jsdoc-var">this.combo.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'select'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cb</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rec</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ix</span><span class="jsdoc-syntax">) {
 185             </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rec.data</span><span class="jsdoc-syntax">);
 186
 187             </span><span class="jsdoc-var">cb.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">);
 188             </span><span class="jsdoc-var">cb.el.dom.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 189             </span><span class="jsdoc-comment">//cb.lastData = rec.data;
 190             // add to list
 191
 192         </span><span class="jsdoc-syntax">}, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 193
 194
 195     },
 196
 197
 198     </span><span class="jsdoc-var">getName</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 199     {
 200         </span><span class="jsdoc-comment">// returns hidden if it's set..
 201         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">) {</span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">};
 202         </span><span class="jsdoc-keyword">return  </span><span class="jsdoc-var">this.hiddenName </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.hiddenName </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">;
 203
 204     },
 205
 206
 207     </span><span class="jsdoc-var">onResize</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">){
 208
 209         </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 210         </span><span class="jsdoc-comment">// not sure if this is needed..
 211         //this.combo.onResize(w,h);
 212
 213         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'number'</span><span class="jsdoc-syntax">){
 214             </span><span class="jsdoc-comment">// we do not handle it!?!?
 215             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 216         }
 217         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.trigger.getWidth</span><span class="jsdoc-syntax">();
 218         </span><span class="jsdoc-var">tw </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">this.addicon </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.addicon.getWidth</span><span class="jsdoc-syntax">() : 0;
 219         </span><span class="jsdoc-var">tw </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">this.editicon </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.editicon.getWidth</span><span class="jsdoc-syntax">() : 0;
 220         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">tw</span><span class="jsdoc-syntax">;
 221         </span><span class="jsdoc-var">this.combo.el.setWidth</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">this.combo.adjustWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">));
 222
 223         </span><span class="jsdoc-var">this.combo.trigger.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'0px'</span><span class="jsdoc-syntax">);
 224
 225         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.list </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.listWidth </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
 226             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">lw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.combo.trigger.getWidth</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.combo.minListWidth</span><span class="jsdoc-syntax">);
 227             </span><span class="jsdoc-var">this.list.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">lw</span><span class="jsdoc-syntax">);
 228             </span><span class="jsdoc-var">this.innerList.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">lw </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.list.getFrameWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'lr'</span><span class="jsdoc-syntax">));
 229         }
 230
 231
 232
 233     },
 234
 235     </span><span class="jsdoc-var">addItem</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rec</span><span class="jsdoc-syntax">)
 236     {
 237         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">valueField </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.valueField</span><span class="jsdoc-syntax">;
 238         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">displayField </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.displayField</span><span class="jsdoc-syntax">;
 239         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.items.indexOfKey</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rec</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">valueField</span><span class="jsdoc-syntax">]) &gt; -1) {
 240             </span><span class="jsdoc-comment">//console.log(&quot;GOT &quot; + rec.data.id);
 241             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 242         }
 243
 244         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.form.ComboBoxArray.Item</span><span class="jsdoc-syntax">({
 245             </span><span class="jsdoc-comment">//id : rec[this.idField],
 246             </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rec</span><span class="jsdoc-syntax">,
 247             </span><span class="jsdoc-var">displayField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">displayField </span><span class="jsdoc-syntax">,
 248             </span><span class="jsdoc-var">tipField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">displayField </span><span class="jsdoc-syntax">,
 249             </span><span class="jsdoc-var">cb </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this
 250         </span><span class="jsdoc-syntax">});
 251         </span><span class="jsdoc-comment">// use the
 252         </span><span class="jsdoc-var">this.items.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rec</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">valueField</span><span class="jsdoc-syntax">],</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">);
 253         </span><span class="jsdoc-comment">// add it before the element..
 254         </span><span class="jsdoc-var">this.updateHiddenEl</span><span class="jsdoc-syntax">();
 255         </span><span class="jsdoc-var">x.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.outerWrap</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.wrap.dom</span><span class="jsdoc-syntax">);
 256         </span><span class="jsdoc-comment">// add the image handler..
 257     </span><span class="jsdoc-syntax">},
 258
 259     </span><span class="jsdoc-var">updateHiddenEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 260     {
 261         </span><span class="jsdoc-var">this.validate</span><span class="jsdoc-syntax">();
 262         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hiddenEl</span><span class="jsdoc-syntax">) {
 263             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 264         }
 265         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ar </span><span class="jsdoc-syntax">= [];
 266         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">idField </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.combo.valueField</span><span class="jsdoc-syntax">;
 267
 268         </span><span class="jsdoc-var">this.items.each</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">) {
 269             </span><span class="jsdoc-var">ar.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f.data</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">idField</span><span class="jsdoc-syntax">]);
 270
 271         });
 272         </span><span class="jsdoc-var">this.hiddenEl.dom.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ar.join</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">','</span><span class="jsdoc-syntax">);
 273         </span><span class="jsdoc-var">this.validate</span><span class="jsdoc-syntax">();
 274     },
 275
 276     </span><span class="jsdoc-var">reset </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 277     {
 278         </span><span class="jsdoc-var">this.items.clear</span><span class="jsdoc-syntax">();
 279
 280         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.outerWrap.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.x-cbarray-item'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.elements</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
 281            </span><span class="jsdoc-var">el.remove</span><span class="jsdoc-syntax">();
 282         });
 283
 284         </span><span class="jsdoc-var">this.el.dom.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 285         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hiddenEl</span><span class="jsdoc-syntax">) {
 286             </span><span class="jsdoc-var">this.hiddenEl.dom.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 287         }
 288
 289     },
 290     </span><span class="jsdoc-var">getValue</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 291     {
 292         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.hiddenEl </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.hiddenEl.dom.value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 293     },
 294     </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">) </span><span class="jsdoc-comment">// not a valid action - must use addItems..
 295     </span><span class="jsdoc-syntax">{
 296
 297         </span><span class="jsdoc-var">this.reset</span><span class="jsdoc-syntax">();
 298
 299
 300
 301         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.store.isLocal </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">)) {
 302             </span><span class="jsdoc-comment">// then we can use the store to find the values..
 303             // comma seperated at present.. this needs to allow JSON based encoding..
 304             </span><span class="jsdoc-var">this.hiddenEl.value  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 305             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v_ar </span><span class="jsdoc-syntax">= [];
 306             </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v.split</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">','</span><span class="jsdoc-syntax">), </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">) {
 307                 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;CHECK &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.valueField </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">',' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">);
 308                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">li </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.store.query</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.valueField</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">);
 309                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">li.length</span><span class="jsdoc-syntax">) {
 310                     </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 311                 }
 312                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">add </span><span class="jsdoc-syntax">= {};
 313                 </span><span class="jsdoc-var">add</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.valueField</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">;
 314                 </span><span class="jsdoc-var">add</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.displayField</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">li.item</span><span class="jsdoc-syntax">(0)</span><span class="jsdoc-var">.data</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.displayField</span><span class="jsdoc-syntax">];
 315
 316                 </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">add</span><span class="jsdoc-syntax">);
 317             }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)
 318
 319         }
 320         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'object' </span><span class="jsdoc-syntax">) {
 321             </span><span class="jsdoc-comment">// then let's assume it's an array of objects..
 322             </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">) {
 323                 </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">);
 324             }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 325
 326         }
 327
 328
 329     },
 330     </span><span class="jsdoc-var">setFromData</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">)
 331     {
 332         </span><span class="jsdoc-comment">// this recieves an object, if setValues is called.
 333         </span><span class="jsdoc-var">this.reset</span><span class="jsdoc-syntax">();
 334         </span><span class="jsdoc-var">this.el.dom.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.displayField</span><span class="jsdoc-syntax">];
 335         </span><span class="jsdoc-var">this.hiddenEl.dom.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.valueField</span><span class="jsdoc-syntax">];
 336         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.valueField</span><span class="jsdoc-syntax">]) != </span><span class="jsdoc-string">'string' </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.valueField</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.length</span><span class="jsdoc-syntax">) {
 337             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 338         }
 339         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">kv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.valueField</span><span class="jsdoc-syntax">];
 340         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.displayField</span><span class="jsdoc-syntax">];
 341         </span><span class="jsdoc-var">kv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">kv</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'string' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">kv</span><span class="jsdoc-syntax">;
 342         </span><span class="jsdoc-var">dv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dv</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'string' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">dv</span><span class="jsdoc-syntax">;
 343
 344
 345         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">keys </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">kv.split</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">','</span><span class="jsdoc-syntax">);
 346         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dv.split</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">','</span><span class="jsdoc-syntax">);
 347         </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0 ; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">keys.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
 348
 349             </span><span class="jsdoc-var">add </span><span class="jsdoc-syntax">= {};
 350             </span><span class="jsdoc-var">add</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.valueField</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">keys</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
 351             </span><span class="jsdoc-var">add</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.displayField</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">display</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
 352             </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">add</span><span class="jsdoc-syntax">);
 353         }
 354
 355
 356     },
 357
 358     </span><span class="jsdoc-comment">/**
 359      * Validates the combox array value
 360      * @return {Boolean} True if the value is valid, else false
 361      */
 362     </span><span class="jsdoc-var">validate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 363         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.validateValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.processValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">()))){
 364             </span><span class="jsdoc-var">this.clearInvalid</span><span class="jsdoc-syntax">();
 365             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 366         }
 367         </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 368     },
 369
 370     </span><span class="jsdoc-var">validateValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">){
 371         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.form.ComboBoxArray.superclass.validateValue.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">());
 372
 373     },
 374
 375     </span><span class="jsdoc-comment">/*@
 376      * overide
 377      *
 378      */
 379     </span><span class="jsdoc-var">isDirty </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 380         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled</span><span class="jsdoc-syntax">) {
 381             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 382         }
 383
 384         </span><span class="jsdoc-keyword">try </span><span class="jsdoc-syntax">{
 385             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.decode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.originalValue</span><span class="jsdoc-syntax">));
 386         } </span><span class="jsdoc-keyword">catch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
 387             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">()) !== </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.originalValue</span><span class="jsdoc-syntax">);
 388         }
 389
 390         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">originalValue </span><span class="jsdoc-syntax">= [];
 391
 392         </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">d.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
 393             </span><span class="jsdoc-var">originalValue.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">][</span><span class="jsdoc-var">this.valueField</span><span class="jsdoc-syntax">]);
 394         }
 395
 396         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">()) !== </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">originalValue.join</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">','</span><span class="jsdoc-syntax">));
 397
 398     }
 399
 400 });
 401
 402
 403
 404 </span><span class="jsdoc-comment">/**
 405  * @class Roo.form.ComboBoxArray.Item
 406  * @extends Roo.BoxComponent
 407  * A selected item in the list
 408  *  Fred [x]  Brian [x]  [Pick another |v]
 409  *
 410  * @constructor
 411  * Create a new item.
 412  * @param {Object} config Configuration options
 413  */
 414
 415 </span><span class="jsdoc-var">Roo.form.ComboBoxArray.Item </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">) {
 416     </span><span class="jsdoc-var">config.id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">();
 417     </span><span class="jsdoc-var">Roo.form.ComboBoxArray.Item.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">);
 418 }
 419
 420 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.form.ComboBoxArray.Item</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.BoxComponent</span><span class="jsdoc-syntax">, {
 421     </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">: {},
 422     </span><span class="jsdoc-var">cb</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 423     </span><span class="jsdoc-var">displayField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 424     </span><span class="jsdoc-var">tipField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 425
 426
 427     </span><span class="jsdoc-var">defaultAutoCreate </span><span class="jsdoc-syntax">: {
 428         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 429         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'x-cbarray-item'</span><span class="jsdoc-syntax">,
 430         </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 431             { </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div' </span><span class="jsdoc-syntax">},
 432             {
 433                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">,
 434                 </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">:16,
 435                 </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">: 16,
 436                 </span><span class="jsdoc-var">src </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.BLANK_IMAGE_URL </span><span class="jsdoc-syntax">,
 437                 </span><span class="jsdoc-var">align</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'center'
 438             </span><span class="jsdoc-syntax">}
 439         ]
 440
 441     },
 442
 443
 444     </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">)
 445     {
 446         </span><span class="jsdoc-var">Roo.form.Field.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">);
 447
 448         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
 449             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getAutoCreate</span><span class="jsdoc-syntax">();
 450             </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ct.createChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
 451         }
 452
 453         </span><span class="jsdoc-var">this.el.child</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.dom.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'src'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.BLANK_IMAGE_URL</span><span class="jsdoc-syntax">);
 454
 455         </span><span class="jsdoc-var">this.el.child</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cb.renderer </span><span class="jsdoc-syntax">?
 456             </span><span class="jsdoc-var">this.cb.renderer</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.data</span><span class="jsdoc-syntax">) :
 457             </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">this.data</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.displayField</span><span class="jsdoc-syntax">]);
 458
 459
 460         </span><span class="jsdoc-var">this.el.child</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.dom.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'qtip'</span><span class="jsdoc-syntax">,
 461                         </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">this.data</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.tipField</span><span class="jsdoc-syntax">])
 462         );
 463
 464         </span><span class="jsdoc-var">this.el.child</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.remove</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 465
 466     },
 467
 468     </span><span class="jsdoc-var">remove </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 469     {
 470         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cb.disabled</span><span class="jsdoc-syntax">){
 471             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 472         }
 473
 474         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">this.cb.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'beforeremove'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.cb</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)){
 475             </span><span class="jsdoc-var">this.cb.items.remove</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 476             </span><span class="jsdoc-var">this.el.child</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.un</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.remove</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 477             </span><span class="jsdoc-var">this.el.remove</span><span class="jsdoc-syntax">();
 478             </span><span class="jsdoc-var">this.cb.updateHiddenEl</span><span class="jsdoc-syntax">();
 479
 480             </span><span class="jsdoc-var">this.cb.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'remove'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.cb</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 481         }
 482
 483     }
 484 });</span></code></body></html>