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

   1
   2
   3 Roo.example = Roo.example || {};
   4
   5 Roo.example.TabPanelCombobox = 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 : 'First TabPanel With ComboBox',
 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 : 12,
 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
 164                                                                         }
 165                                                                     ]
 166
 167                                                                 }
 168                                                             ]
 169
 170                                                         },
 171                                                         {
 172                                                             xns: Roo.bootstrap,
 173                                                             tabId : '#two',
 174                                                             xtype : 'TabPanel',
 175                                                             xns : Roo.bootstrap,
 176                                                             navId : '#top',
 177                                                             active : false,
 178                                                             items : [
 179                                                                 {
 180                                                                     xns: Roo.bootstrap,
 181                                                                     level : 4,
 182                                                                     xtype : 'Header',
 183                                                                     html : 'Second TabPanel With ComboBox',
 184                                                                     xns : Roo.bootstrap
 185                                                                 },
 186                                                                 {
 187                                                                     xns: Roo.bootstrap,
 188                                                                     xtype : 'Container',
 189                                                                     well : 'md',
 190                                                                     xns : Roo.bootstrap,
 191                                                                     items : [
 192                                                                         {
 193                                                                             xns: Roo.bootstrap,
 194                                                                             xtype : 'Row',
 195                                                                             xns : Roo.bootstrap,
 196                                                                             items : [
 197                                                                                 {
 198                                                                                     xns: Roo.bootstrap,
 199                                                                                     md : 12,
 200                                                                                     xtype : 'Column',
 201                                                                                     xns : Roo.bootstrap,
 202                                                                                     items : [
 203                                                                                         {
 204                                                                                             xns: Roo.bootstrap,
 205                                                                                             labelAlign : 'top',
 206                                                                                             fieldLabel : 'Family Name',
 207                                                                                             xtype : 'Input',
 208                                                                                             allowBlank : true,
 209                                                                                             xns : Roo.bootstrap,
 210                                                                                             name : 'lastname'
 211                                                                                         }
 212                                                                                     ]
 213
 214                                                                                 }
 215                                                                             ]
 216
 217                                                                         }
 218                                                                     ]
 219
 220                                                                 }
 221                                                             ]
 222
 223                                                         }
 224                                                     ]
 225
 226                                                 }
 227                                             ]
 228
 229                                         }
 230                                     ]
 231
 232                                 }
 233                             ]
 234
 235                         }
 236                     ]
 237
 238                 }
 239             ]
 240         };
 241     }
 242 });