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

   1 <html><head><title>Roo/bootstrap/form/TriggerField.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  * - LGPL
   3  *
   4  * trigger field - base class for combo..
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.form.TriggerField
  10  * @extends Roo.bootstrap.form.Input
  11  * Provides a convenient wrapper for TextFields that adds a clickable trigger button (looks like a combobox by default).
  12  * The trigger has no default action, so you must assign a function to implement the trigger click handler by
  13  * overriding {@link #onTriggerClick}. You can create a TriggerField directly, as it renders exactly like a combobox
  14  * for which you can provide a custom implementation.  For example:
  15  * &lt;pre&gt;&lt;code&gt;
  16 var trigger = new Roo.bootstrap.form.TriggerField();
  17 trigger.onTriggerClick = myTriggerFn;
  18 trigger.applyTo('my-field');
  19 &lt;/code&gt;&lt;/pre&gt;
  20  *
  21  * However, in general you will most likely want to use TriggerField as the base class for a reusable component.
  22  * {@link Roo.bootstrap.form.DateField} and {@link Roo.bootstrap.form.ComboBox} are perfect examples of this.
  23  * @cfg {String} triggerClass An additional CSS class used to style the trigger button.  The trigger will always get the
  24  * class 'x-form-trigger' by default and triggerClass will be &lt;b&gt;appended&lt;/b&gt; if specified.
  25  * @cfg {String} caret (search|calendar) BS3 only - carat fa name
  26
  27  * @constructor
  28  * Create a new TriggerField.
  29  * @param {Object} config Configuration options (valid {@Roo.bootstrap.form.Input} config options will also be applied
  30  * to the base TextField)
  31  */
  32 </span><span class="jsdoc-var">Roo.bootstrap.form.TriggerField </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">){
  33     </span><span class="jsdoc-var">this.mimicing </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
  34     </span><span class="jsdoc-var">Roo.bootstrap.form.TriggerField.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">);
  35 };
  36
  37 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.form.TriggerField</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.form.Input</span><span class="jsdoc-syntax">,  {
  38     </span><span class="jsdoc-comment">/**
  39      * @cfg {String} triggerClass A CSS class to apply to the trigger
  40      */
  41      /**
  42      * @cfg {Boolean} hideTrigger True to hide the trigger element and display only the base text field (defaults to false)
  43      */
  44     </span><span class="jsdoc-var">hideTrigger</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  45
  46     </span><span class="jsdoc-comment">/**
  47      * @cfg {Boolean} removable (true|false) special filter default false
  48      */
  49     </span><span class="jsdoc-var">removable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  50
  51     </span><span class="jsdoc-comment">/** @cfg {Boolean} grow @hide */
  52     /** @cfg {Number} growMin @hide */
  53     /** @cfg {Number} growMax @hide */
  54
  55     /**
  56      * @hide
  57      * @method
  58      */
  59     </span><span class="jsdoc-var">autoSize</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.emptyFn</span><span class="jsdoc-syntax">,
  60     </span><span class="jsdoc-comment">// private
  61     </span><span class="jsdoc-var">monitorTab </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  62     </span><span class="jsdoc-comment">// private
  63     </span><span class="jsdoc-var">deferHeight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  64
  65
  66     </span><span class="jsdoc-var">actionMode </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'wrap'</span><span class="jsdoc-syntax">,
  67
  68     </span><span class="jsdoc-var">caret </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  69
  70
  71     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  72
  73         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.labelAlign </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.parentLabelAlign</span><span class="jsdoc-syntax">();
  74
  75         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">();
  76
  77         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
  78             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'form-group' </span><span class="jsdoc-comment">//input-group
  79         </span><span class="jsdoc-syntax">};
  80
  81
  82         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">input </span><span class="jsdoc-syntax">=  {
  83             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">,
  84             </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
  85             </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.inputType</span><span class="jsdoc-syntax">,
  86             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'form-control'</span><span class="jsdoc-syntax">,
  87             </span><span class="jsdoc-var">autocomplete</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'new-password'</span><span class="jsdoc-syntax">,
  88             </span><span class="jsdoc-var">placeholder </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.placeholder </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">''
  89
  90         </span><span class="jsdoc-syntax">};
  91         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">) {
  92             </span><span class="jsdoc-var">input.name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">;
  93         }
  94         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.size</span><span class="jsdoc-syntax">) {
  95             </span><span class="jsdoc-var">input.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' input-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.size</span><span class="jsdoc-syntax">;
  96         }
  97
  98         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled</span><span class="jsdoc-syntax">) {
  99             </span><span class="jsdoc-var">input.disabled</span><span class="jsdoc-syntax">=</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 100         }
 101
 102         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">inputblock </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">input</span><span class="jsdoc-syntax">;
 103
 104         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hasFeedback </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.allowBlank</span><span class="jsdoc-syntax">){
 105
 106             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">feedback </span><span class="jsdoc-syntax">= {
 107                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 108                 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'glyphicon form-control-feedback'
 109             </span><span class="jsdoc-syntax">};
 110
 111             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.removable </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.editable  </span><span class="jsdoc-syntax">){
 112                 </span><span class="jsdoc-var">inputblock </span><span class="jsdoc-syntax">= {
 113                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'has-feedback'</span><span class="jsdoc-syntax">,
 114                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">:  [
 115                         </span><span class="jsdoc-var">inputblock</span><span class="jsdoc-syntax">,
 116                         {
 117                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
 118                             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'x'</span><span class="jsdoc-syntax">,
 119                             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-combo-removable-btn close'
 120                         </span><span class="jsdoc-syntax">},
 121                         </span><span class="jsdoc-var">feedback
 122                     </span><span class="jsdoc-syntax">]
 123                 };
 124             } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 125                 </span><span class="jsdoc-var">inputblock </span><span class="jsdoc-syntax">= {
 126                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'has-feedback'</span><span class="jsdoc-syntax">,
 127                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">:  [
 128                         </span><span class="jsdoc-var">inputblock</span><span class="jsdoc-syntax">,
 129                         </span><span class="jsdoc-var">feedback
 130                     </span><span class="jsdoc-syntax">]
 131                 };
 132             }
 133
 134         } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 135             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.removable </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.editable </span><span class="jsdoc-syntax">){
 136                 </span><span class="jsdoc-var">inputblock </span><span class="jsdoc-syntax">= {
 137                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-removable'</span><span class="jsdoc-syntax">,
 138                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">:  [
 139                         </span><span class="jsdoc-var">inputblock</span><span class="jsdoc-syntax">,
 140                         {
 141                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
 142                             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'x'</span><span class="jsdoc-syntax">,
 143                             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-combo-removable-btn close'
 144                         </span><span class="jsdoc-syntax">}
 145                     ]
 146                 };
 147             }
 148         }
 149
 150         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.after</span><span class="jsdoc-syntax">) {
 151
 152             </span><span class="jsdoc-var">inputblock </span><span class="jsdoc-syntax">= {
 153                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input-group'</span><span class="jsdoc-syntax">,
 154                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">:  []
 155             };
 156             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before</span><span class="jsdoc-syntax">) {
 157                 </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">({
 158                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 159                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input-group-addon input-group-prepend input-group-text'</span><span class="jsdoc-syntax">,
 160                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.before
 161                 </span><span class="jsdoc-syntax">});
 162             }
 163
 164             </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">input</span><span class="jsdoc-syntax">);
 165
 166             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hasFeedback </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.allowBlank</span><span class="jsdoc-syntax">){
 167                 </span><span class="jsdoc-var">inputblock.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' has-feedback'</span><span class="jsdoc-syntax">;
 168                 </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">feedback</span><span class="jsdoc-syntax">);
 169             }
 170
 171             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.after</span><span class="jsdoc-syntax">) {
 172                 </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">({
 173                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 174                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input-group-addon input-group-append input-group-text'</span><span class="jsdoc-syntax">,
 175                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.after
 176                 </span><span class="jsdoc-syntax">});
 177             }
 178
 179         };
 180
 181
 182
 183         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ibwrap </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">inputblock</span><span class="jsdoc-syntax">;
 184
 185         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.multiple</span><span class="jsdoc-syntax">){
 186             </span><span class="jsdoc-var">ibwrap </span><span class="jsdoc-syntax">= {
 187                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'ul'</span><span class="jsdoc-syntax">,
 188                 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-select2-choices'</span><span class="jsdoc-syntax">,
 189                 </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">:[
 190                     {
 191                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'li'</span><span class="jsdoc-syntax">,
 192                         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-select2-search-field'</span><span class="jsdoc-syntax">,
 193                         </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
 194
 195                             </span><span class="jsdoc-var">inputblock
 196                         </span><span class="jsdoc-syntax">]
 197                     }
 198                 ]
 199             };
 200
 201         }
 202
 203         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">combobox </span><span class="jsdoc-syntax">= {
 204             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-select2-container input-group'</span><span class="jsdoc-syntax">,
 205             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
 206                  {
 207                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">,
 208                     </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'hidden'</span><span class="jsdoc-syntax">,
 209                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'form-hidden-field'
 210                 </span><span class="jsdoc-syntax">},
 211                 </span><span class="jsdoc-var">ibwrap
 212             </span><span class="jsdoc-syntax">]
 213         };
 214
 215         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.multiple </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.showToggleBtn</span><span class="jsdoc-syntax">){
 216
 217             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">caret </span><span class="jsdoc-syntax">= {
 218                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 219                         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'caret'
 220              </span><span class="jsdoc-syntax">};
 221             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.caret </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
 222                 </span><span class="jsdoc-var">caret </span><span class="jsdoc-syntax">= {
 223                      </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
 224                      </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'fa fa-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.caret
 225                 </span><span class="jsdoc-syntax">};
 226
 227             }
 228
 229             </span><span class="jsdoc-var">combobox.cn.push</span><span class="jsdoc-syntax">({
 230                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 231                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input-group-addon input-group-append input-group-text btn dropdown-toggle'</span><span class="jsdoc-syntax">,
 232                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 233                     </span><span class="jsdoc-var">Roo.bootstrap.version </span><span class="jsdoc-syntax">== 3 ? </span><span class="jsdoc-var">caret </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 234                     {
 235                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 236                         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'combobox-clear'</span><span class="jsdoc-syntax">,
 237                         </span><span class="jsdoc-var">cn  </span><span class="jsdoc-syntax">: [
 238                             {
 239                                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
 240                                 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'icon-remove'
 241                             </span><span class="jsdoc-syntax">}
 242                         ]
 243                     }
 244                 ]
 245
 246             })
 247         }
 248
 249         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.multiple</span><span class="jsdoc-syntax">){
 250             </span><span class="jsdoc-var">combobox.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' roo-select2-container-multi'</span><span class="jsdoc-syntax">;
 251         }
 252          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">indicator </span><span class="jsdoc-syntax">= {
 253             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
 254             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-required-indicator ' </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">this.indicatorpos </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'right'  </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'right' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">) +</span><span class="jsdoc-string">'-indicator text-danger fa fa-lg fa-star'</span><span class="jsdoc-syntax">,
 255             </span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'This field is required'
 256         </span><span class="jsdoc-syntax">};
 257
 258         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.allowBlank</span><span class="jsdoc-syntax">) {
 259             </span><span class="jsdoc-var">indicator </span><span class="jsdoc-syntax">= {
 260                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
 261                 </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'display:none'
 262             </span><span class="jsdoc-syntax">};
 263         }
 264
 265
 266
 267         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">===</span><span class="jsdoc-string">'left' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.fieldLabel.length</span><span class="jsdoc-syntax">) {
 268
 269             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' roo-form-group-label-left'  </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">Roo.bootstrap.version </span><span class="jsdoc-syntax">== 4 ? </span><span class="jsdoc-string">' row' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">);
 270
 271             </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 272                 </span><span class="jsdoc-var">indicator</span><span class="jsdoc-syntax">,
 273                 {
 274                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'label'</span><span class="jsdoc-syntax">,
 275                     </span><span class="jsdoc-string">'for' </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
 276                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'control-label'</span><span class="jsdoc-syntax">,
 277                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.fieldLabel
 278
 279                 </span><span class="jsdoc-syntax">},
 280                 {
 281                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">,
 282                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
 283                         </span><span class="jsdoc-var">combobox
 284                     </span><span class="jsdoc-syntax">]
 285                 }
 286
 287             ];
 288
 289             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">labelCfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cfg.cn</span><span class="jsdoc-syntax">[1];
 290             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">contentCfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cfg.cn</span><span class="jsdoc-syntax">[2];
 291
 292             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.indicatorpos </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">){
 293                 </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 294                     {
 295                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'label'</span><span class="jsdoc-syntax">,
 296                         </span><span class="jsdoc-string">'for' </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
 297                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'control-label'</span><span class="jsdoc-syntax">,
 298                         </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 299                             {
 300                                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 301                                 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.fieldLabel
 302                             </span><span class="jsdoc-syntax">},
 303                             </span><span class="jsdoc-var">indicator
 304                         </span><span class="jsdoc-syntax">]
 305                     },
 306                     {
 307                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">,
 308                         </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
 309                             </span><span class="jsdoc-var">combobox
 310                         </span><span class="jsdoc-syntax">]
 311                     }
 312
 313                 ];
 314
 315                 </span><span class="jsdoc-var">labelCfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cfg.cn</span><span class="jsdoc-syntax">[0];
 316                 </span><span class="jsdoc-var">contentCfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cfg.cn</span><span class="jsdoc-syntax">[1];
 317             }
 318
 319             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelWidth </span><span class="jsdoc-syntax">&gt; 12){
 320                 </span><span class="jsdoc-var">labelCfg.style </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;width: &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labelWidth </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'px'</span><span class="jsdoc-syntax">;
 321             }
 322
 323             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelWidth </span><span class="jsdoc-syntax">&lt; 13 &amp;&amp; </span><span class="jsdoc-var">this.labelmd </span><span class="jsdoc-syntax">== 0){
 324                 </span><span class="jsdoc-var">this.labelmd </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.labelWidth</span><span class="jsdoc-syntax">;
 325             }
 326
 327             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labellg </span><span class="jsdoc-syntax">&gt; 0){
 328                 </span><span class="jsdoc-var">labelCfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-lg-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labellg</span><span class="jsdoc-syntax">;
 329                 </span><span class="jsdoc-var">contentCfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-lg-' </span><span class="jsdoc-syntax">+ (12 - </span><span class="jsdoc-var">this.labellg</span><span class="jsdoc-syntax">);
 330             }
 331
 332             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelmd </span><span class="jsdoc-syntax">&gt; 0){
 333                 </span><span class="jsdoc-var">labelCfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-md-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labelmd</span><span class="jsdoc-syntax">;
 334                 </span><span class="jsdoc-var">contentCfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-md-' </span><span class="jsdoc-syntax">+ (12 - </span><span class="jsdoc-var">this.labelmd</span><span class="jsdoc-syntax">);
 335             }
 336
 337             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelsm </span><span class="jsdoc-syntax">&gt; 0){
 338                 </span><span class="jsdoc-var">labelCfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-sm-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labelsm</span><span class="jsdoc-syntax">;
 339                 </span><span class="jsdoc-var">contentCfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-sm-' </span><span class="jsdoc-syntax">+ (12 - </span><span class="jsdoc-var">this.labelsm</span><span class="jsdoc-syntax">);
 340             }
 341
 342             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelxs </span><span class="jsdoc-syntax">&gt; 0){
 343                 </span><span class="jsdoc-var">labelCfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-xs-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labelxs</span><span class="jsdoc-syntax">;
 344                 </span><span class="jsdoc-var">contentCfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-xs-' </span><span class="jsdoc-syntax">+ (12 - </span><span class="jsdoc-var">this.labelxs</span><span class="jsdoc-syntax">);
 345             }
 346
 347         } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">this.fieldLabel.length</span><span class="jsdoc-syntax">) {
 348 </span><span class="jsdoc-comment">//                Roo.log(&quot; label&quot;);
 349             </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 350                 </span><span class="jsdoc-var">indicator</span><span class="jsdoc-syntax">,
 351                {
 352                    </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'label'</span><span class="jsdoc-syntax">,
 353                    </span><span class="jsdoc-comment">//cls : 'input-group-addon',
 354                    </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.fieldLabel
 355
 356                </span><span class="jsdoc-syntax">},
 357
 358                </span><span class="jsdoc-var">combobox
 359
 360             </span><span class="jsdoc-syntax">];
 361
 362             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.indicatorpos </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">){
 363
 364                 </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 365                     {
 366                        </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'label'</span><span class="jsdoc-syntax">,
 367                        </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 368                            {
 369                                </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 370                                </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.fieldLabel
 371                            </span><span class="jsdoc-syntax">},
 372                            </span><span class="jsdoc-var">indicator
 373                        </span><span class="jsdoc-syntax">]
 374
 375                     },
 376                     </span><span class="jsdoc-var">combobox
 377
 378                 </span><span class="jsdoc-syntax">];
 379
 380             }
 381
 382         } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 383
 384 </span><span class="jsdoc-comment">//                Roo.log(&quot; no label &amp;&amp; no align&quot;);
 385                 </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">combobox
 386
 387
 388         </span><span class="jsdoc-syntax">}
 389
 390         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">settings</span><span class="jsdoc-syntax">=</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 391         [</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'md'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'lg'</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.map</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">){
 392             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">settings</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">]) {
 393                 </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">settings</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">];
 394             }
 395         });
 396
 397         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 398
 399     },
 400
 401
 402
 403     </span><span class="jsdoc-comment">// private
 404     </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">){
 405 </span><span class="jsdoc-comment">//        Roo.bootstrap.form.TriggerField.superclass.onResize.apply(this, arguments);
 406 //        if(typeof w == 'number'){
 407 //            var x = w - this.trigger.getWidth();
 408 //            this.inputEl().setWidth(this.adjustWidth('input', x));
 409 //            this.trigger.setStyle('left', x+'px');
 410 //        }
 411     </span><span class="jsdoc-syntax">},
 412
 413     </span><span class="jsdoc-comment">// private
 414     </span><span class="jsdoc-var">adjustSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.BoxComponent.prototype.adjustSize</span><span class="jsdoc-syntax">,
 415
 416     </span><span class="jsdoc-comment">// private
 417     </span><span class="jsdoc-var">getResizeEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 418         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">();
 419     },
 420
 421     </span><span class="jsdoc-comment">// private
 422     </span><span class="jsdoc-var">getPositionEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 423         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">();
 424     },
 425
 426     </span><span class="jsdoc-comment">// private
 427     </span><span class="jsdoc-var">alignErrorIcon </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 428         </span><span class="jsdoc-var">this.errorIcon.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-string">'tl-tr'</span><span class="jsdoc-syntax">, [2, 0]);
 429     },
 430
 431     </span><span class="jsdoc-comment">// private
 432     </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 433
 434         </span><span class="jsdoc-var">this.createList</span><span class="jsdoc-syntax">();
 435
 436         </span><span class="jsdoc-var">Roo.bootstrap.form.TriggerField.superclass.initEvents.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 437         </span><span class="jsdoc-comment">//this.wrap = this.el.wrap({cls: &quot;x-form-field-wrap&quot;});
 438         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.multiple </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.showToggleBtn</span><span class="jsdoc-syntax">){
 439             </span><span class="jsdoc-var">this.trigger </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'span.dropdown-toggle'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 440             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hideTrigger</span><span class="jsdoc-syntax">){
 441                 </span><span class="jsdoc-var">this.trigger.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 442             }
 443             </span><span class="jsdoc-var">this.trigger.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;click&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTriggerClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">preventDefault</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">});
 444         }
 445
 446         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.multiple</span><span class="jsdoc-syntax">){
 447             </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;click&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTriggerClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">preventDefault</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">});
 448         }
 449
 450         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.removable </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.editable </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.tickable</span><span class="jsdoc-syntax">){
 451             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">close </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.closeTriggerEl</span><span class="jsdoc-syntax">();
 452
 453             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">close</span><span class="jsdoc-syntax">){
 454                 </span><span class="jsdoc-var">close.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.hide</span><span class="jsdoc-syntax">();
 455                 </span><span class="jsdoc-var">close.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.removeBtnClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">close</span><span class="jsdoc-syntax">);
 456             }
 457         }
 458
 459         </span><span class="jsdoc-comment">//this.trigger.addClassOnOver('x-form-trigger-over');
 460         //this.trigger.addClassOnClick('x-form-trigger-click');
 461
 462         //if(!this.width){
 463         //    this.wrap.setWidth(this.el.getWidth()+this.trigger.getWidth());
 464         //}
 465     </span><span class="jsdoc-syntax">},
 466
 467     </span><span class="jsdoc-var">closeTriggerEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 468     {
 469         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">close </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-combo-removable-btn'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 470         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">close </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">close </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 471     },
 472
 473     </span><span class="jsdoc-var">removeBtnClick </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">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">)
 474     {
 475         </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
 476
 477         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;remove&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">) !== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 478             </span><span class="jsdoc-var">this.reset</span><span class="jsdoc-syntax">();
 479             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;afterremove&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)
 480         }
 481     },
 482
 483     </span><span class="jsdoc-var">createList </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 484     {
 485         </span><span class="jsdoc-var">this.list </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.createChild</span><span class="jsdoc-syntax">({
 486             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap.version </span><span class="jsdoc-syntax">== 4 ? </span><span class="jsdoc-string">'div' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'ul'</span><span class="jsdoc-syntax">,
 487             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'typeahead typeahead-long dropdown-menu shadow'</span><span class="jsdoc-syntax">,
 488             </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'display:none'
 489         </span><span class="jsdoc-syntax">});
 490
 491         </span><span class="jsdoc-var">this.list.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.originalDisplay </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;;
 492
 493     },
 494
 495     </span><span class="jsdoc-comment">// private
 496     </span><span class="jsdoc-var">initTrigger </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 497
 498     },
 499
 500     </span><span class="jsdoc-comment">// private
 501     </span><span class="jsdoc-var">onDestroy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 502         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.trigger</span><span class="jsdoc-syntax">){
 503             </span><span class="jsdoc-var">this.trigger.removeAllListeners</span><span class="jsdoc-syntax">();
 504           </span><span class="jsdoc-comment">//  this.trigger.remove();
 505         </span><span class="jsdoc-syntax">}
 506         </span><span class="jsdoc-comment">//if(this.wrap){
 507         //    this.wrap.remove();
 508         //}
 509         </span><span class="jsdoc-var">Roo.bootstrap.form.TriggerField.superclass.onDestroy.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 510     },
 511
 512     </span><span class="jsdoc-comment">// private
 513     </span><span class="jsdoc-var">onFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 514         </span><span class="jsdoc-var">Roo.bootstrap.form.TriggerField.superclass.onFocus.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 515         </span><span class="jsdoc-comment">/*
 516         if(!this.mimicing){
 517             this.wrap.addClass('x-trigger-wrap-focus');
 518             this.mimicing = true;
 519             Roo.get(Roo.isIE ? document.body : document).on(&quot;mousedown&quot;, this.mimicBlur, this);
 520             if(this.monitorTab){
 521                 this.el.on(&quot;keydown&quot;, this.checkTab, this);
 522             }
 523         }
 524         */
 525     </span><span class="jsdoc-syntax">},
 526
 527     </span><span class="jsdoc-comment">// private
 528     </span><span class="jsdoc-var">checkTab </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">){
 529         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.getKey</span><span class="jsdoc-syntax">() == </span><span class="jsdoc-var">e.TAB</span><span class="jsdoc-syntax">){
 530             </span><span class="jsdoc-var">this.triggerBlur</span><span class="jsdoc-syntax">();
 531         }
 532     },
 533
 534     </span><span class="jsdoc-comment">// private
 535     </span><span class="jsdoc-var">onBlur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 536         </span><span class="jsdoc-comment">// do nothing
 537     </span><span class="jsdoc-syntax">},
 538
 539     </span><span class="jsdoc-comment">// private
 540     </span><span class="jsdoc-var">mimicBlur </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">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">){
 541         </span><span class="jsdoc-comment">/*
 542         if(!this.wrap.contains(t) &amp;&amp; this.validateBlur()){
 543             this.triggerBlur();
 544         }
 545         */
 546     </span><span class="jsdoc-syntax">},
 547
 548     </span><span class="jsdoc-comment">// private
 549     </span><span class="jsdoc-var">triggerBlur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 550         </span><span class="jsdoc-var">this.mimicing </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 551         </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">document.body </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.un</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mousedown&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.mimicBlur</span><span class="jsdoc-syntax">);
 552         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.monitorTab</span><span class="jsdoc-syntax">){
 553             </span><span class="jsdoc-var">this.el.un</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;keydown&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.checkTab</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 554         }
 555         </span><span class="jsdoc-comment">//this.wrap.removeClass('x-trigger-wrap-focus');
 556         </span><span class="jsdoc-var">Roo.bootstrap.form.TriggerField.superclass.onBlur.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 557     },
 558
 559     </span><span class="jsdoc-comment">// private
 560     // This should be overriden by any subclass that needs to check whether or not the field can be blurred.
 561     </span><span class="jsdoc-var">validateBlur </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">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">){
 562         </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 563     },
 564
 565     </span><span class="jsdoc-comment">// private
 566     </span><span class="jsdoc-var">onDisable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 567         </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 568         </span><span class="jsdoc-comment">//Roo.bootstrap.form.TriggerField.superclass.onDisable.call(this);
 569         //if(this.wrap){
 570         //    this.wrap.addClass('x-item-disabled');
 571         //}
 572     </span><span class="jsdoc-syntax">},
 573
 574     </span><span class="jsdoc-comment">// private
 575     </span><span class="jsdoc-var">onEnable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 576         </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 577         </span><span class="jsdoc-comment">//Roo.bootstrap.form.TriggerField.superclass.onEnable.call(this);
 578         //if(this.wrap){
 579         //    this.el.removeClass('x-item-disabled');
 580         //}
 581     </span><span class="jsdoc-syntax">},
 582
 583     </span><span class="jsdoc-comment">// private
 584     </span><span class="jsdoc-var">onShow </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 585         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ae </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getActionEl</span><span class="jsdoc-syntax">();
 586
 587         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ae</span><span class="jsdoc-syntax">){
 588             </span><span class="jsdoc-var">ae.dom.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 589             </span><span class="jsdoc-var">ae.dom.style.visibility </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'visible'</span><span class="jsdoc-syntax">;
 590         }
 591     },
 592
 593     </span><span class="jsdoc-comment">// private
 594
 595     </span><span class="jsdoc-var">onHide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 596         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ae </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getActionEl</span><span class="jsdoc-syntax">();
 597         </span><span class="jsdoc-var">ae.dom.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'none'</span><span class="jsdoc-syntax">;
 598     },
 599
 600     </span><span class="jsdoc-comment">/**
 601      * The function that should handle the trigger's click event.  This method does nothing by default until overridden
 602      * by an implementing function.
 603      * @method
 604      * @param {EventObject} e
 605      */
 606     </span><span class="jsdoc-var">onTriggerClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.emptyFn
 607 </span><span class="jsdoc-syntax">});
 608  </span></code></body></html>