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

   1
   2
   3 Roo.example = Roo.example || {};
   4
   5 Roo.example.combobox = new Roo.XComponent({
   6     part     :  ["example","combobox"],
   7     order    : '001-viewpanel',
   8     region   : '',
   9     parent   : false,
  10     name     : "unnamed module",
  11     disabled : false,
  12     permname : '',
  13     _tree : function()
  14     {
  15
  16
  17         var _this = this;
  18         var MODULE = this;
  19
  20         return {
  21             xtype: 'Body',
  22             xns: Roo.bootstrap,
  23             items : [
  24                  {
  25                     xtype: 'ComboBox',
  26                     xns: Roo.bootstrap,
  27                     placeholder : 'Select a country',
  28                     displayField : 'title',
  29                     hiddenName : 'country_id',
  30                     md : '12',
  31                     size : 'sm',
  32                     name : 'title',
  33                     triggerAction : 'all',
  34                     minChars : '1',
  35                     tpl : '<li class="roo-select2-result"><b>{title}</b></div>',
  36                     listWidth : '400',
  37                     multiple: true,
  38                     listeners : {
  39                         render : function (_self) {
  40                             _this.countrySel = _self;
  41                         }
  42                     },
  43                     forceSelection : true,
  44                     valueField : 'id',
  45                     queryParam : 'query[name]',
  46                     editable : true,
  47                     alwaysQuery : true,
  48                     allowBlank : false,
  49                     fieldLabel : 'Country',
  50                     pageSize : '10',
  51                     append: true,
  52                     store : {
  53                         xtype: 'Store',
  54                         xns: Roo.data,
  55                         listeners : {
  56                             beforeload : function (_self, o) {
  57                                 o.params = o.params || {};
  58
  59                                 var selected = _this.countrySel.getValue();
  60
  61                                 if(selected.length){
  62                                     o.params._skip = selected;
  63                                 }
  64
  65                             }
  66                         },
  67                         remoteSort : true,
  68                         sortInfo : { direction : 'ASC', field: 'name' },
  69                         proxy : {
  70                             xtype: 'HttpProxy',
  71                             xns: Roo.data,
  72                             url : '../bootstrap/data.country.js',
  73                             method : 'GET'
  74                         },
  75                         reader : {
  76                             xtype: 'JsonReader',
  77                             xns: Roo.data,
  78                             fields : [
  79                                 {
  80                                     'name': 'id',
  81                                     'type': 'int'
  82                                 },
  83                                 {
  84                                     'name': 'code',
  85                                     'type': 'string'
  86                                 },
  87                                 {
  88                                     'name': 'title',
  89                                     'type': 'string'
  90                                 }
  91                             ]
  92                         }
  93                     }
  94                 }
  95             ]
  96         };
  97     }
  98 });