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     :  ["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                     xtype: 'ComboBox',
  32                     xns: Roo.bootstrap,
  33                     placeholder : 'Select a country',
  34                     displayField : 'name',
  35                     hiddenName : 'country_id',
  36                     md : '12',
  37                     size : 'sm',
  38                     width : 300,
  39                     name : 'country_id_name',
  40                     triggerAction : 'all',
  41                     minChars : '2',
  42                     tpl : '<div class="x-grid-cell-text x-btn button"><b>{name}</b></div>',
  43                     listWidth : '400',
  44                     listeners : {
  45                         render : function (_self) {
  46                             _this.countrySel = _self;
  47                         }
  48                     },
  49                     forceSelection : true,
  50                     valueField : 'id',
  51                     queryParam : 'query[name]',
  52                     editable : true,
  53                     alwaysQuery : true,
  54                     allowBlank : false,
  55                     fieldLabel : 'Country',
  56                     pageSize : '20',
  57                     append: true,
  58                     store : {
  59                         xtype: 'Store',
  60                         xns: Roo.data,
  61                         listeners : {
  62                             beforeload : function (_self, o) {
  63                                 o.params = o.params || {};
  64                             }
  65                         },
  66                         proxy : {
  67                             xtype: 'HttpProxy',
  68                             xns: Roo.data,
  69                             url : baseURL + '/Roo/Core_geoip_country',
  70                             method : 'GET'
  71                         },
  72                         reader : {
  73                             xtype: 'JsonReader',
  74                             xns: Roo.data,
  75                             fields : [
  76                                 {
  77                                     'name': 'id',
  78                                     'type': 'int'
  79                                 },
  80                                 {
  81                                     'name': 'code',
  82                                     'type': 'string'
  83                                 },
  84                                 {
  85                                     'name': 'name',
  86                                     'type': 'string'
  87                                 }
  88                             ]
  89                         }
  90                     }
  91                 }
  92             ]
  93         };
  94     }
  95 });