git.roojs.org Git - roojs1/blob - examples/bootstrap/TabPanel-ComboBox.js

   1
   2
   3 Roo.example = Roo.example || {};
   4
   5 Roo.example.combobox = new Roo.XComponent({
   6     part     :  ["layout","viewpanel"],
   7     order    : '001-viewpanel',
   8     region   : '',
   9     parent   : '#bootstrap',
  10     name     : "unnamed module",
  11     disabled : false,
  12     permname : '',
  13     _tree : function()
  14     {
  15
  16         this.parent = {
  17             el : new Roo.bootstrap.Body()
  18         }
  19         this.parent.el.layout = false;
  20         this.parent.el.render(document.body);
  21
  22         var _this = this;
  23         var MODULE = this;
  24         var baseURL = '/web.eventmanager/demo.local.php';
  25
  26         return {
  27             xtype: 'Body',
  28             xns: Roo.bootstrap,
  29             items : [
  30                  {
  31                     '|xns' : 'Roo.bootstrap',
  32                     xtype : 'Container',
  33                     cls : 'content',
  34                     xns : Roo.bootstrap,
  35                     style : 'margin-top:100px',
  36                     items : [
  37                         {
  38                             '|xns' : 'Roo.bootstrap',
  39                             xtype : 'Container',
  40                             cls : 'pad-wrapper',
  41                             xns : Roo.bootstrap,
  42                             items : [
  43                                 {
  44                                     '|xns' : 'Roo.bootstrap',
  45                                     xtype : 'Container',
  46                                     cls : 'container alpha',
  47                                     xns : Roo.bootstrap,
  48                                     items : [
  49                                         {
  50                                             '|xns' : 'Roo.bootstrap',
  51                                             xtype : 'Container',
  52                                             xns : Roo.bootstrap,
  53                                             items : [
  54                                                 {
  55                                                     '|xns' : 'Roo.bootstrap',
  56                                                     xtype : 'NavSimplebar',
  57                                                     xns : Roo.bootstrap,
  58                                                     items : [
  59                                                         {
  60                                                             '|xns' : 'Roo.bootstrap',
  61                                                             navId : '#top',
  62                                                             xtype : 'NavGroup',
  63                                                             xns : Roo.bootstrap,
  64                                                             type : 'pills',
  65                                                             listeners : {
  66                                                                 render : function (_self)
  67                                                                    {
  68                                                                         _this.navGroup = this;
  69                                                                    }
  70                                                             },
  71                                                             items : [
  72                                                                 {
  73                                                                     '|xns' : 'Roo.bootstrap',
  74                                                                     tabId : '#one',
  75                                                                     xtype : 'NavItem',
  76                                                                     preventDefault : true,
  77                                                                     html : 1,
  78                                                                     xns : Roo.bootstrap,
  79                                                                     active : true,
  80                                                                     listeners : {
  81                                                                         render : function (_self)
  82                                                                            {
  83                                                                               _this.one = this;
  84
  85                                                                            }
  86                                                                     }
  87                                                                 },
  88                                                                 {
  89                                                                     '|xns' : 'Roo.bootstrap',
  90                                                                     tabId : '#two',
  91                                                                     xtype : 'NavItem',
  92                                                                     preventDefault : true,
  93                                                                     html : 2,
  94                                                                     xns : Roo.bootstrap,
  95                                                                     active : false,
  96                                                                     listeners : {
  97                                                                         render : function (_self)
  98                                                                            {
  99                                                                               _this.two = this;
 100
 101                                                                            }
 102                                                                     }
 103                                                                 }
 104                                                             ]
 105
 106                                                         }
 107                                                     ]
 108
 109                                                 },
 110                                                 {
 111                                                     '|xns' : 'Roo.bootstrap',
 112                                                     xtype : 'TabGroup',
 113                                                     style : 'margin-top:20px;',
 114                                                     xns : Roo.bootstrap,
 115                                                     navId : '#top',
 116                                                     carousel : true,
 117                                                     items : [
 118                                                         {
 119                                                             '|xns' : 'Roo.bootstrap',
 120                                                             tabId : '#one',
 121                                                             xtype : 'TabPanel',
 122                                                             xns : Roo.bootstrap,
 123                                                             navId : '#top',
 124                                                             active : true,
 125                                                             items : [
 126                                                                 {
 127                                                                     '|xns' : 'Roo.bootstrap',
 128                                                                     level : 4,
 129                                                                     xtype : 'Header',
 130                                                                     html : 'Your Basic Details',
 131                                                                     xns : Roo.bootstrap
 132                                                                 },
 133                                                                 {
 134                                                                     '|xns' : 'Roo.bootstrap',
 135                                                                     xtype : 'Container',
 136                                                                     well : 'md',
 137                                                                     xns : Roo.bootstrap,
 138                                                                     items : [
 139                                                                         {
 140                                                                             '|xns' : 'Roo.bootstrap',
 141                                                                             xtype : 'Row',
 142                                                                             xns : Roo.bootstrap,
 143                                                                             items : [
 144                                                                                 {
 145                                                                                     '|xns' : 'Roo.bootstrap',
 146                                                                                     md : 6,
 147                                                                                     xtype : 'Column',
 148                                                                                     xns : Roo.bootstrap,
 149                                                                                     items : [
 150                                                                                         {
 151                                                                                             '|xns' : 'Roo.bootstrap',
 152                                                                                             labelAlign : 'top',
 153                                                                                             fieldLabel : 'Family Name',
 154                                                                                             xtype : 'Input',
 155                                                                                             allowBlank : true,
 156                                                                                             xns : Roo.bootstrap,
 157                                                                                             name : 'lastname'
 158                                                                                         }
 159                                                                                     ]
 160
 161                                                                                 },
 162                                                                                 {
 163                                                                                     '|xns' : 'Roo.bootstrap',
 164                                                                                     md : 6,
 165                                                                                     xtype : 'Column',
 166                                                                                     xns : Roo.bootstrap,
 167                                                                                     items : [
 168                                                                                         {
 169                                                                                             '|xns' : 'Roo.bootstrap',
 170                                                                                             labelAlign : 'top',
 171                                                                                             fieldLabel : 'Family Name - Local Language (optional)',
 172                                                                                             xtype : 'Input',
 173                                                                                             allowBlank : true,
 174                                                                                             xns : Roo.bootstrap,
 175                                                                                             name : 'lastname_alt'
 176                                                                                         }
 177                                                                                     ]
 178
 179                                                                                 }
 180                                                                             ]
 181
 182                                                                         },
 183                                                                         {
 184                                                                             '|xns' : 'Roo.bootstrap',
 185                                                                             xtype : 'Row',
 186                                                                             xns : Roo.bootstrap,
 187                                                                             items : [
 188                                                                                 {
 189                                                                                     '|xns' : 'Roo.bootstrap',
 190                                                                                     md : 6,
 191                                                                                     xtype : 'Column',
 192                                                                                     xns : Roo.bootstrap,
 193                                                                                     items : [
 194                                                                                         {
 195                                                                                             '|xns' : 'Roo.bootstrap',
 196                                                                                             labelAlign : 'top',
 197                                                                                             fieldLabel : 'Given Name',
 198                                                                                             xtype : 'Input',
 199                                                                                             allowBlank : true,
 200                                                                                             xns : Roo.bootstrap,
 201                                                                                             name : 'firstname'
 202                                                                                         }
 203                                                                                     ]
 204
 205                                                                                 },
 206                                                                                 {
 207                                                                                     '|xns' : 'Roo.bootstrap',
 208                                                                                     md : 6,
 209                                                                                     xtype : 'Column',
 210                                                                                     xns : Roo.bootstrap,
 211                                                                                     items : [
 212                                                                                         {
 213                                                                                             '|xns' : 'Roo.bootstrap',
 214                                                                                             labelAlign : 'top',
 215                                                                                             fieldLabel : 'Given Name - Local Language (optional)',
 216                                                                                             xtype : 'Input',
 217                                                                                             allowBlank : true,
 218                                                                                             xns : Roo.bootstrap,
 219                                                                                             name : 'firstname_alt'
 220                                                                                         }
 221                                                                                     ]
 222
 223                                                                                 }
 224                                                                             ]
 225
 226                                                                         },
 227                                                                         {
 228                                                                             '|xns' : 'Roo.bootstrap',
 229                                                                             xtype : 'Row',
 230                                                                             xns : Roo.bootstrap,
 231                                                                             items : [
 232                                                                                 {
 233                                                                                     '|xns' : 'Roo.bootstrap',
 234                                                                                     md : 6,
 235                                                                                     xtype : 'Column',
 236                                                                                     xns : Roo.bootstrap,
 237                                                                                     items : [
 238                                                                                         {
 239                                                                                             '|xns' : 'Roo.bootstrap',
 240                                                                                             allowBlank : false,
 241                                                                                             name : 'birth_date',
 242                                                                                             format : 'd/M/Y',
 243                                                                                             xtype : 'DateField',
 244                                                                                             placeholder : 'Day/Month/Year',
 245                                                                                             xns : Roo.bootstrap,
 246                                                                                             fieldLabel : 'Date of Birth',
 247                                                                                             before : '<i class=\"fa fa-clock-o\"></i>',
 248                                                                                             disableKeyFilter : true
 249                                                                                         }
 250                                                                                     ]
 251
 252                                                                                 }
 253                                                                             ]
 254
 255                                                                         }
 256                                                                     ]
 257
 258                                                                 },
 259                                                                 {
 260                                                                     '|xns' : 'Roo.bootstrap',
 261                                                                     level : 4,
 262                                                                     xtype : 'Header',
 263                                                                     html : 'Your Plans',
 264                                                                     xns : Roo.bootstrap
 265                                                                 },
 266                                                                 {
 267                                                                     '|xns' : 'Roo.bootstrap',
 268                                                                     xtype : 'Container',
 269                                                                     xns : Roo.bootstrap,
 270                                                                     well : 'md',
 271                                                                     items : [
 272                                                                         {
 273                                                                             '|xns' : 'Roo.bootstrap',
 274                                                                             xtype : 'Row',
 275                                                                             xns : Roo.bootstrap,
 276                                                                             items : [
 277                                                                                 {
 278                                                                                     '|xns' : 'Roo.bootstrap',
 279                                                                                     md : 6,
 280                                                                                     xtype : 'Column',
 281                                                                                     xns : Roo.bootstrap,
 282                                                                                     items : [
 283                                                                                         {
 284                                                                                             store : {
 285                                                                                                 '|xns' : 'Roo.data',
 286                                                                                                 data : [
 287                                                                                                     ['I am actively looking for work','YES'],
 288                                                                                                     [
 289                                                                                                         'Would consider a relivant offer',
 290                                                                                                         'MAYBE'
 291                                                                                                     ],
 292                                                                                                     [
 293                                                                                                        'Not currently interesetd unless meets aspirational goals',
 294                                                                                                        'ASPIRE'
 295                                                                                                     ]
 296                                                                                                 ],
 297                                                                                                 xtype : 'SimpleStore',
 298                                                                                                 xns : Roo.data,
 299                                                                                                 fields : [ 'label','value' ]
 300                                                                                             },
 301                                                                                             '|xns' : 'Roo.bootstrap',
 302                                                                                             selectOnFocus : true,
 303                                                                                             mode : 'local',
 304                                                                                             name : '',
 305                                                                                             valueField : 'value',
 306                                                                                             xtype : 'ComboBox',
 307                                                                                             editable : false,
 308                                                                                             triggerAction : 'all',
 309                                                                                             alwaysQuery : true,
 310                                                                                             placeholder : '',
 311                                                                                             listWidth : 400,
 312                                                                                             xns : Roo.bootstrap,
 313                                                                                             tpl : '<div class=\"select2-result\"><b>{label}</b></div>',
 314                                                                                             fieldLabel : 'How would you describe your career plans',
 315                                                                                             hiddenName : 'employ_plan',
 316                                                                                             displayField : 'label',
 317                                                                                             forceSelection : true,
 318                                                                                             listeners : {
 319                                                                                                 render : function (_self)
 320                                                                                                    {
 321                                                                                                       // this.setValue('Individual');
 322                                                                                                       this.el.select('span').removeClass('btn');
 323                                                                                                    },
 324                                                                                                 select : function (combo, record, index)
 325                                                                                                    {
 326
 327                                                                                                    }
 328                                                                                             },
 329                                                                                             items : [
 330
 331                                                                                             ]
 332
 333                                                                                         }
 334                                                                                     ]
 335
 336                                                                                 }
 337                                                                             ]
 338
 339                                                                         }
 340                                                                     ]
 341
 342                                                                 }
 343                                                             ]
 344
 345                                                         },
 346                                                         {
 347                                                             '|xns' : 'Roo.bootstrap',
 348                                                             tabId : '#two',
 349                                                             xtype : 'TabPanel',
 350                                                             xns : Roo.bootstrap,
 351                                                             navId : '#top',
 352                                                             active : false,
 353                                                             items : [
 354                                                                 {
 355                                                                     '|xns' : 'Roo.bootstrap',
 356                                                                     level : 4,
 357                                                                     xtype : 'Header',
 358                                                                     html : 'Country and Languages',
 359                                                                     xns : Roo.bootstrap
 360                                                                 },
 361                                                                 {
 362                                                                     '|xns' : 'Roo.bootstrap',
 363                                                                     xtype : 'Container',
 364                                                                     well : 'md',
 365                                                                     xns : Roo.bootstrap,
 366                                                                     items : [
 367                                                                         {
 368                                                                             '|xns' : 'Roo.bootstrap',
 369                                                                             xtype : 'Row',
 370                                                                             xns : Roo.bootstrap,
 371                                                                             items : [
 372                                                                                 {
 373                                                                                     '|xns' : 'Roo.bootstrap',
 374                                                                                     md : 6,
 375                                                                                     xtype : 'Column',
 376                                                                                     xns : Roo.bootstrap,
 377                                                                                     items : [
 378                                                                                         {
 379                                                                                             store : {
 380                                                                                                 proxy : {
 381                                                                                                     '|xns' : 'Roo.data',
 382                                                                                                     xtype : 'HttpProxy',
 383                                                                                                     xns : Roo.data,
 384                                                                                                     method : 'GET',
 385                                                                                                     url : baseURL+'/Geoip/Country'
 386                                                                                                 },
 387                                                                                                 reader : {
 388                                                                                                     '|xns' : 'Roo.data',
 389                                                                                                     xtype : 'JsonReader',
 390                                                                                                     xns : Roo.data,
 391                                                                                                     fields : [
 392                                                                                                         {
 393                                                                                                             'name': 'id',
 394                                                                                                             'type': 'int'
 395                                                                                                         },
 396                                                                                                         {
 397                                                                                                             'name': 'name',
 398                                                                                                             'type': 'string'
 399                                                                                                         }
 400                                                                                                     ]
 401                                                                                                 },
 402                                                                                                 '|xns' : 'Roo.data',
 403                                                                                                 xtype : 'Store',
 404                                                                                                 xns : Roo.data,
 405                                                                                                 sortInfo : {field:"name",direction:"ASC"},
 406                                                                                                 listeners : {
 407                                                                                                         beforeload : function (_self, options)
 408                                                                                                            {
 409
 410                                                                                                            }
 411                                                                                                 },
 412                                                                                                 items : [
 413
 414                                                                                                 ]
 415
 416                                                                                             },
 417                                                                                             '|xns' : 'Roo.bootstrap',
 418                                                                                             name : 'country',
 419                                                                                             minChars : 2,
 420                                                                                             valueField : 'id',
 421                                                                                             queryParam : 'query[name]',
 422                                                                                             typeAhead : true,
 423                                                                                             xtype : 'ComboBox',
 424                                                                                             triggerAction : 'all',
 425                                                                                             editable : true,
 426                                                                                             alwaysQuery : true,
 427                                                                                             listWidth : 500,
 428                                                                                             xns : Roo.bootstrap,
 429                                                                                             tpl : '<div class=\"select2-result\"><b>{name}</b></div>',
 430                                                                                             fieldLabel : 'Country of Residence',
 431                                                                                             hiddenName : 'country',
 432                                                                                             displayField : 'name',
 433                                                                                             append : true,
 434                                                                                             listeners : {
 435                                                                                                 render : function (_self)
 436                                                                                                    {
 437                                                                                                       this.el.select('span').removeClass('btn');
 438                                                                                                    },
 439                                                                                                 select : function (combo, record, index)
 440                                                                                                    {
 441                                                                                                        this.opt_id = record.data.id;
 442                                                                                                        _this.country = this;
 443                                                                                                    }
 444                                                                                             },
 445                                                                                             items : [
 446
 447                                                                                             ]
 448
 449                                                                                         }
 450                                                                                     ]
 451
 452                                                                                 },
 453                                                                                 {
 454                                                                                     '|xns' : 'Roo.bootstrap',
 455                                                                                     md : 6,
 456                                                                                     xtype : 'Column',
 457                                                                                     xns : Roo.bootstrap,
 458                                                                                     items : [
 459                                                                                         {
 460                                                                                             store : {
 461                                                                                                 proxy : {
 462                                                                                                     '|xns' : 'Roo.data',
 463                                                                                                     xtype : 'HttpProxy',
 464                                                                                                     xns : Roo.data,
 465                                                                                                     method : 'GET',
 466                                                                                                     url : baseURL+'/Geoip/City'
 467                                                                                                 },
 468                                                                                                 reader : {
 469                                                                                                     '|xns' : 'Roo.data',
 470                                                                                                     xtype : 'JsonReader',
 471                                                                                                     fields : [
 472                                                                                                         {
 473                                                                                                             'name': 'id',
 474                                                                                                             'type': 'int'
 475                                                                                                         },
 476                                                                                                         {
 477                                                                                                             'name': 'name',
 478                                                                                                             'type': 'string'
 479                                                                                                         }
 480
 481                                                                                                     ],
 482                                                                                                     xns : Roo.data
 483                                                                                                 },
 484                                                                                                 '|xns' : 'Roo.data',
 485                                                                                                 xtype : 'Store',
 486                                                                                                 xns : Roo.data,
 487                                                                                                 sortInfo : {field:"name",direction:"ASC"},
 488                                                                                                 listeners : {
 489                                                                                                         beforeload : function (_self, options)
 490                                                                                                            {
 491                                                                                                                    options.params.country_id = _this.country.opt_id;
 492                                                                                                            }
 493                                                                                                 },
 494                                                                                                 items : [
 495
 496                                                                                                 ]
 497
 498                                                                                             },
 499                                                                                             '|xns' : 'Roo.bootstrap',
 500                                                                                             name : 'city',
 501                                                                                             minChars : 2,
 502                                                                                             valueField : 'id',
 503                                                                                             queryParam : 'query[name]',
 504                                                                                             typeAhead : true,
 505                                                                                             xtype : 'ComboBox',
 506                                                                                             triggerAction : 'all',
 507                                                                                             editable : true,
 508                                                                                             alwaysQuery : true,
 509                                                                                             listWidth : 500,
 510                                                                                             xns : Roo.bootstrap,
 511                                                                                             tpl : '<div class=\"select2-result\"><b>{name}</b></div>',
 512                                                                                             fieldLabel : 'City',
 513                                                                                             hiddenName : 'city',
 514                                                                                             displayField : 'name',
 515                                                                                             append : true,
 516                                                                                             listeners : {
 517                                                                                                 render : function (_self)
 518                                                                                                    {
 519                                                                                                       this.el.select('span').removeClass('btn');
 520                                                                                                    }
 521                                                                                             },
 522                                                                                             items : [
 523
 524                                                                                             ]
 525
 526                                                                                         }
 527                                                                                     ]
 528
 529                                                                                 }
 530                                                                             ]
 531
 532                                                                         },
 533                                                                         {
 534                                                                             '|xns' : 'Roo.bootstrap',
 535                                                                             xtype : 'Row',
 536                                                                             xns : Roo.bootstrap,
 537                                                                             items : [
 538                                                                                 {
 539                                                                                     '|xns' : 'Roo.bootstrap',
 540                                                                                     md : 6,
 541                                                                                     xtype : 'Column',
 542                                                                                     xns : Roo.bootstrap,
 543                                                                                     items : [
 544                                                                                         {
 545                                                                                             store : {
 546                                                                                                 proxy : {
 547                                                                                                     '|xns' : 'Roo.data',
 548                                                                                                     xtype : 'HttpProxy',
 549                                                                                                     xns : Roo.data,
 550                                                                                                     method : 'GET',
 551                                                                                                     url : baseURL+'/Roo/Core_enum'
 552                                                                                                 },
 553                                                                                                 reader : {
 554                                                                                                     '|xns' : 'Roo.data',
 555                                                                                                     xtype : 'JsonReader',
 556                                                                                                     xns : Roo.data,
 557                                                                                                     fields : [
 558                                                                                                         {
 559                                                                                                             'name': 'id',
 560                                                                                                             'type': 'int'
 561                                                                                                         },
 562                                                                                                         {
 563                                                                                                             'name': 'name',
 564                                                                                                             'type': 'string'
 565                                                                                                         },
 566                                                                                                         {
 567                                                                                                             'name': 'display_name',
 568                                                                                                             'type': 'string'
 569                                                                                                         }
 570                                                                                                     ]
 571                                                                                                 },
 572                                                                                                 '|xns' : 'Roo.data',
 573                                                                                                 xtype : 'Store',
 574                                                                                                 sortInfo : {field:"display_name",direction:"ASC"},
 575                                                                                                 xns : Roo.data,
 576                                                                                                 listeners : {
 577                                                                                                         beforeload : function (_self, options)
 578                                                                                                            {
 579                                                                                                                    options.params.etype='Hydra.LanguageSpoken';
 580
 581                                                                                                                    var selected = _this.lang.getValue();
 582                                                                                                                    if(selected.length){
 583                                                                                                                        options.params._skip = selected;
 584                                                                                                                    }
 585                                                                                                            }
 586                                                                                                 },
 587                                                                                                 items : [
 588
 589                                                                                                 ]
 590
 591                                                                                             },
 592                                                                                             '|xns' : 'Roo.bootstrap',
 593                                                                                             minChars : 2,
 594                                                                                             name : '',
 595                                                                                             valueField : 'id',
 596                                                                                             queryParam : 'query[search]',
 597                                                                                             xtype : 'ComboBox',
 598                                                                                             triggerAction : 'all',
 599                                                                                             editable : false,
 600                                                                                             alwaysQuery : true,
 601                                                                                             listWidth : 500,
 602                                                                                             xns : Roo.bootstrap,
 603                                                                                             tpl : '<div class=\"select2-result\"><b>{display_name}</b></div>',
 604                                                                                             fieldLabel : 'First (Native) Language',
 605                                                                                             hiddenName : 'lang',
 606                                                                                             displayField : 'display_name',
 607                                                                                             forceSelection : true,
 608                                                                                             listeners : {
 609                                                                                                 render : function (_self)
 610                                                                                                    {
 611                                                                                                           this.el.select('span').removeClass('btn');
 612                                                                                                    }
 613                                                                                             },
 614                                                                                             items : [
 615
 616                                                                                             ]
 617
 618                                                                                         }
 619                                                                                     ]
 620
 621                                                                                 },
 622                                                                                 {
 623                                                                                     '|xns' : 'Roo.bootstrap',
 624                                                                                     md : 6,
 625                                                                                     xtype : 'Column',
 626                                                                                     xns : Roo.bootstrap,
 627                                                                                     items : [
 628                                                                                         {
 629                                                                                             store : {
 630                                                                                                 proxy : {
 631                                                                                                     '|xns' : 'Roo.data',
 632                                                                                                     xtype : 'HttpProxy',
 633                                                                                                     xns : Roo.data,
 634                                                                                                     method : 'GET',
 635                                                                                                     url : baseURL+'/Roo/Core_enum'
 636                                                                                                 },
 637                                                                                                 reader : {
 638                                                                                                     '|xns' : 'Roo.data',
 639                                                                                                     xtype : 'JsonReader',
 640                                                                                                     fields : [
 641                                                                                                         {
 642                                                                                                             'name': 'id',
 643                                                                                                             'type': 'int'
 644                                                                                                         },
 645                                                                                                         {
 646                                                                                                             'name': 'display_name',
 647                                                                                                             'type': 'string'
 648                                                                                                         }
 649                                                                                                     ],
 650                                                                                                     xns : Roo.data
 651                                                                                                 },
 652                                                                                                 '|xns' : 'Roo.data',
 653                                                                                                 xtype : 'Store',
 654                                                                                                 xns : Roo.data,
 655                                                                                                 sortInfo : {field:"display_name",direction:"ASC"},
 656                                                                                                 listeners : {
 657                                                                                                         beforeload : function (_self, options)
 658                                                                                                            {
 659                                                                                                                    options.params.etype='Hydra.LanguageSpoken';
 660
 661                                                                                                                    /*var selected = _this.lang.getValue();
 662                                                                                                                    if(selected.length){
 663                                                                                                                        options.params._skip = selected;
 664                                                                                                                    }*/
 665                                                                                                            }
 666                                                                                                 },
 667                                                                                                 items : [
 668
 669                                                                                                 ]
 670
 671                                                                                             },
 672                                                                                             '|xns' : 'Roo.bootstrap',
 673                                                                                             minChars : 2,
 674                                                                                             cls : 'col-md-12',
 675                                                                                             name : '',
 676                                                                                             valueField : 'id',
 677                                                                                             editNotList : true,
 678                                                                                             queryParam : 'query[search]',
 679                                                                                             xtype : 'ComboBox',
 680                                                                                             triggerAction : 'all',
 681                                                                                             editable : true,
 682                                                                                             alwaysQuery : true,
 683                                                                                             listWidth : 400,
 684                                                                                             xns : Roo.bootstrap,
 685                                                                                             fieldLabel : 'Other Languages Spoken',
 686                                                                                             hiddenName : 'lang_multi',
 687                                                                                             multiple : true,
 688                                                                                             tickable : true,
 689                                                                                             displayField : 'display_name',
 690                                                                                             forceSelection : true,
 691                                                                                             listeners : {
 692                                                                                                 render : function (_self)
 693                                                                                                    {
 694                                                                                                        _this.lang = this;
 695                                                                                                    }
 696                                                                                             },
 697                                                                                             items : [
 698
 699                                                                                             ]
 700
 701                                                                                         }
 702                                                                                     ]
 703
 704                                                                                 }
 705                                                                             ]
 706
 707                                                                         }
 708                                                                     ]
 709
 710                                                                 }
 711                                                             ]
 712
 713                                                         }
 714                                                     ]
 715
 716                                                 }
 717                                             ]
 718
 719                                         }
 720                                     ]
 721
 722                                 }
 723                             ]
 724
 725                         }
 726                     ]
 727
 728                 }
 729             ]
 730         };
 731     }
 732 });