git.roojs.org Git - roojs1/blob - examples/form/nestedcombo.js

   1 /*
   2  *
   3  * (C) Alan Knowles 2011
   4  * Licence : Roojs - LGPL
   5  */
   6
   7 var mform;
   8 var combo, cats;
   9 Roo.onReady(function(){
  10
  11     Roo.QuickTips.init();
  12
  13       sampledata  = [
  14         ['A', 'A states', [
  15             ['AK', 'Alaska'],
  16             ['AZ', 'Arizona', [
  17                 ['AK', 'Alaska'],
  18                 ['AZ', 'Arizona'],
  19                 ['AR', 'Arkansas']
  20             ]],
  21             ['AR', 'Arkansas']
  22
  23         ]],
  24         ['C', 'C states', [
  25           ['CA', 'California'],
  26             ['CO', 'Colorado'],
  27             ['CT', 'Connecticut']
  28         ]],
  29         ['D', 'D states', [
  30             ['DE', 'Delaware'],
  31             ['DC', 'District of Columbia']
  32         ]],
  33         ['I', 'I states', [
  34
  35             ['ID', 'Idaho'],
  36             ['IL', 'Illinois'],
  37             ['IN', 'Indiana'],
  38             ['IA', 'Iowa'],
  39             ['IDA', 'Idaho'],
  40             ['ILA', 'Illinois'],
  41             ['INA', 'Indiana'],
  42             ['IAA', 'Iowa']
  43         ]],
  44         ['E', 'Empty states', []],
  45     ];
  46     /*
  47      * ================  Form 2  =======================
  48      */
  49     mform = Roo.factory({
  50         xns : Roo.form,
  51         xtype : 'Form',
  52         labelAlign: 'top',
  53         items : [
  54             {
  55                 xtype : 'ComboNested',
  56                 xns: Roo.form,
  57
  58                 fieldLabel: 'State',
  59
  60                 name : 'states_list',
  61                 hiddenName:'states',
  62
  63
  64                 valueField : 'abbr',
  65                 displayField:'state',
  66
  67
  68                 store: {
  69                     xns : Roo.data,
  70                     xtype : 'SimpleStore',
  71                     fields: ['abbr', 'state' , 'cn'],
  72                     data : sampledata// from states.js
  73
  74                 },
  75                 listWidth: 250,
  76                 typeAhead: true,
  77                 mode: 'local',
  78                 triggerAction: 'all',
  79                 emptyText:'Select a state...',
  80                 selectOnFocus:true,
  81                 width:190,
  82                 listeners : {
  83                     change: function() {
  84                         Roo.log("changed to " + this.getValue());
  85
  86                     }
  87                 }
  88           },
  89
  90            {
  91             xtype : 'ComboNested',
  92             allowBlank : true,
  93             alwaysQuery : true,
  94             displayField : 'name',
  95             editable : false,
  96             emptyText : 'Category',
  97             fieldLabel : 'Category',
  98             forceSelection : true,
  99             hiddenName : 'supplier_category_id',
 100             listWidth : 200,
 101             maxColumns : 4,
 102             maxHeight: 400,
 103             loadingText : 'Searching',
 104             minChars : 2,
 105             name : 'supplier_category_id_name',
 106             pageSize : 999,
 107             qtip : 'Category',
 108             queryParam : 'query[fullpath]',
 109             selectOnFocus : true,
 110             triggerAction : 'all',
 111             typeAhead : true,
 112             valueField : 'id',
 113             width : 300,
 114             listeners : {
 115              select : function (combo, record, index)
 116               {
 117                  // _this.grid.footer.onClick('first');
 118               }
 119             },
 120             xns : Roo.form,
 121             '|xns' : 'Roo.form',
 122             store : {
 123              xtype : 'Store',
 124              remoteSort : true,
 125              sortInfo : { direction : 'ASC', field: 'fullpath' },
 126              listeners : {
 127               beforeload : function (_self, o){
 128                    o.params = o.params || {};
 129                    o.params._as_tree = 1;
 130                    // set more here
 131                }
 132              },
 133              xns : Roo.data,
 134              '|xns' : 'Roo.data',
 135              proxy : {
 136               xtype : 'HttpProxy',
 137               method : 'GET',
 138               url : '/web.Texon/admin.php/Roo/category.php',
 139               xns : Roo.data,
 140               '|xns' : 'Roo.data'
 141              },
 142              reader : {
 143               xtype : 'JsonReader',
 144               fields : [{"name":"id","type":"int"},{"name":"fullpath","type":"string"},'name',   'cn' ],
 145               id : 'id',
 146               root : 'data',
 147               totalProperty : 'total',
 148               xns : Roo.data,
 149               '|xns' : 'Roo.data'
 150              }
 151             }
 152            },
 153
 154
 155
 156         ]
 157
 158     });
 159
 160     mform.render('form-ct5');
 161     combo = mform.findField('states');
 162     cats = mform.findField('supplier_category_id');
 163    /* mform.setValues({
 164         states : '["AK","AZ"]',
 165         states_list : "Alaska, Arizona"
 166
 167     });
 168     */
 169
 170
 171 });