examples/bootstrap/ComboBox.js
[roojs1] / examples / bootstrap / ComboBox.js
index 76d8d64..0c1a444 100644 (file)
@@ -21,7 +21,7 @@ Roo.example.combobox = new Roo.XComponent({
         
         var _this = this;
         var MODULE = this;
-        var baseURL = '/web.eventmanager/admin.php';
+        var baseURL = '/web.eventmanager/demo.local.php';
         
         return {
             xtype: 'Body',
@@ -30,41 +30,52 @@ Roo.example.combobox = new Roo.XComponent({
                  {
                     xtype: 'ComboBox',
                     xns: Roo.bootstrap,
-                    placeholder : 'Location',
-                    displayField : 'country_name',
-                    hiddenName : 'country',
-                    md : '4',
+                    placeholder : 'Select a country',
+                    displayField : 'title',
+                    hiddenName : 'country_id',
+                    md : '12',
                     size : 'sm',
-                    style : 'margin-left:10px',
-                    name : 'country_name',
+                    name : 'title',
                     triggerAction : 'all',
-                    minChars : '2',
-                    tpl : '<div class="x-grid-cell-text x-btn button"><b>{country_name}</b></div>',
+                    minChars : '1',
+                    tpl : '<li class="roo-select2-result"><b>{title}</b></div>',
                     listWidth : '400',
+                    multiple: true,
                     listeners : {
                         render : function (_self) {
-                            _this.locSel = _self;
-
+                            _this.countrySel = _self;
                         }
                     },
                     forceSelection : true,
-                    valueField : 'country',
-                    queryParam : 'query[country]',
+                    valueField : 'id',
+                    queryParam : 'query[name]',
                     editable : true,
                     alwaysQuery : true,
+                    allowBlank : false,
+                    fieldLabel : 'Country',
+                    pageSize : '10',
+                    append: true,
                     store : {
                         xtype: 'Store',
                         xns: Roo.data,
                         listeners : {
                             beforeload : function (_self, o) {
                                 o.params = o.params || {};
-                                o.params._countryList = 1;
+                                
+                                var selected = _this.countrySel.getValue();
+                                
+                                if(selected.length){
+                                    o.params._skip = selected;
+                                }
+                                
                             }
                         },
+                        remoteSort : true,
+                        sortInfo : { direction : 'ASC', field: 'name' },
                         proxy : {
                             xtype: 'HttpProxy',
                             xns: Roo.data,
-                            url : baseURL + '/Roo/Core_cities',
+                            url : '../boostrap/data.country.js',
                             method : 'GET'
                         },
                         reader : {
@@ -76,15 +87,11 @@ Roo.example.combobox = new Roo.XComponent({
                                     'type': 'int'
                                 },
                                 {
-                                    'name': 'name',
-                                    'type': 'string'
-                                },
-                                {
-                                    'name': 'country',
+                                    'name': 'code',
                                     'type': 'string'
                                 },
                                 {
-                                    'name': 'country_name',
+                                    'name': 'title',
                                     'type': 'string'
                                 }
                             ]