gridview - Issue with grids within tabs in extjs -


i have reviewed other posts using grids within tabs , choosing extend/xtype approach... however, getting error when adding reference grid in tab:

ext.define('mygrid', {     extend: 'ext.grid.panel',     alias: 'widget.mygrid',     width:425,     height:250,     collapsible:true,     title:'simple listview <i>(0 items selected)</i>',     renderto: ext.getbody(),      store: store,     multiselect: true,     viewconfig: {         emptytext: 'no images display'     },      columns: [{         text: 'file',         flex: 50,         dataindex: 'name'     },{         text: 'last modified',         xtype: 'datecolumn',         format: 'm-d h:i a',         flex: 35,         dataindex: 'lastmod'     },{         text: 'size',         dataindex: 'size',         tpl: '{size:filesize}',         align: 'right',         flex: 15,         cls: 'listview-filesize'     }] });  ext.create('ext.tab.panel', { width: 700, height: 200, activetab: 0, items: [     {         title: 'item assets',         xtype: 'listview'     },     {         title: 'item assets',         bodypadding: 10,         html : 'link item assets tab'     },     {         title: 'item epi',         bodypadding: 10,         html : 'link epi'     },     {         title: 'item package',         bodypadding: 10,         html : 'link package'     },     {         title: 'item price',         bodypadding: 10,         html : 'link price'     },     {         title: 'ymm info',         bodypadding: 10,         html : 'link ymm'     }//,     //listview,listview,listview ], renderto : ext.getbody() });  

the error getting is:

"ext-all-debug.js (line 5040)

typeerror: name undefined

if (name === || name.substring(0, from.length) === from) {"

if comment out "xtype: listview" tabs show properly....

i'm sure it's simple i'm missing...

full code here:

ext.loader.setconfig({enabled: true});   ext.loader.setpath('ext.ux', '/include/extjs/examples/ux/');  ext.require([ 'ext.grid.*', 'ext.data.*', 'ext.util.*', 'ext.toolbar.paging', 'ext.ux.previewplugin', 'ext.modelmanager', 'ext.tip.quicktipmanager', 'ext.state.*'  ]);   ext.onready(function() { ext.direct.manager.addprovider(ext.app.remoting_api); ext.tip.quicktipmanager.init();  //added model inside onready ext.define('manufacturer', {     extend: 'ext.data.model',     fields: ['id', 'part_no', 'tddb_retail', 'tddb_jobber', 'tddb_descr', 'tddb_category' ,'tddb_subcategory'] });  //separated store unique var guaranteerange var store = ext.create('ext.data.store', {     model: 'manufacturer',      autoload: true,      pagesize: 15,      loadmask: true,     proxy: {         type: 'direct',                 //  extraparams:{ codes_id: 410 },          api: {                      //  create: inventory.readmanu,                      read: inventory.readinventory,                    update: inventory.updateinventory,                  // destroy: worklist.getresults                      },           reader: {                            type: 'json',                            root: 'data',                           totalproperty: 'total',                 successproperty: 'success'                 },               writer: {                            type: 'json',                  writeallfields: true,                          encode: false,                            root: 'data'                 },         listeners: {                      exception: function(proxy, response, operation){                                   ext.messagebox.show({                                          title: 'remote exception',                                            msg: operation.geterror(),                                           icon: ext.messagebox.error,                                        buttons: ext.msg.ok                                   });                                 }                   },          }          });     store.getproxy().extraparams = { codes_id: document.getelementbyid( 'codes_id').value };  //create grid    var pluginexpanded = true; var grid = ext.create('ext.grid.panel', {     height: 350,     width: 700,     title: 'manufacturer url listing info',     store: store,     tools:[{      type:'save',     tooltip: 'save data', // hidden:true,  handler: function(event, toolel, panel){     // refresh logic      //rowediting.canceledit();   var sm = grid.getselectionmodel();    ext.msg.show({        title:'update data',        msg: 'are sure want update item information?',        buttons: ext.msg.yesno,        icon: ext.msg.question,        fn: function(btn){         if (btn === 'yes'){             store.update();             //store.sync();             store.load();            //ext.getcmp(grid).getview().refresh();         }        }   });      }  }],     columns: [         {         dataindex: 'id',         flex: 1,         text: 'id',                    hidden: true     },         {         dataindex: 'part_no',         flex: 1,         text: 'part number',         editor: 'textfield'     }, {         dataindex: 'tddb_retail',         flex: 1.3,         text: 'td retail',         editor: 'textfield'     },      {         dataindex: 'tddb_jobber',         flex: 1.3,         text: 'td retail',         editor: 'textfield'     },{         dataindex: 'tddb_descr',         flex: 1,         text: 'description',         editor: 'textfield'     },     {         dataindex: 'tddb_category',         flex: 1,         text: 'category',         editor: 'textfield'     },     {         dataindex: 'tddb_subcategory',         flex: 1,         text: 'sub category',         editor: 'textfield'     },],             forcefit: true,     seltype: 'cellmodel',     plugins: [     ext.create('ext.grid.plugin.cellediting', {         clickstoedit: 1     })      ],  //paging bar bbar: ext.create('ext.pagingtoolbar', {         store: store,         pagesize: 15,         displayinfo: true,         displaymsg: 'displaying items {0} - {1} of {2}',         emptymsg: "no items display",     }),      renderto: ext.getbody(),  }    );   ext.define('mygrid', {     extend: 'ext.grid.panel',     alias: 'widget.mygrid',     width:425,     height:250,     collapsible:true,     title:'simple listview <i>(0 items selected)</i>',     renderto: ext.getbody(),      store: store,     multiselect: true,     viewconfig: {         emptytext: 'no images display'     },      columns: [{         text: 'file',         flex: 50,         dataindex: 'name'     },{         text: 'last modified',         xtype: 'datecolumn',         format: 'm-d h:i a',         flex: 35,         dataindex: 'lastmod'     },{         text: 'size',         dataindex: 'size',         tpl: '{size:filesize}',         align: 'right',         flex: 15,         cls: 'listview-filesize'     }] });   ext.create('ext.tab.panel', { width: 700, height: 200, activetab: 0, items: [     {         title: 'item assets',         xtype: 'listview'     },     {         title: 'item assets',         bodypadding: 10,         html : 'link item assets tab'     },     {         title: 'item epi',         bodypadding: 10,         html : 'link epi'     },     {         title: 'item package',         bodypadding: 10,         html : 'link package'     },     {         title: 'item price',         bodypadding: 10,         html : 'link price'     },     {         title: 'ymm info',         bodypadding: 10,         html : 'link ymm'     }//,     //listview,listview,listview ], renderto : ext.getbody()  });    }); 

any appreciated!

the alias of grid "widget.mygrid". so, need configure xtype as:

... {     title: 'item assets',     xtype: 'mygrid' } .... 

Popular posts from this blog

How to calculate SNR of signals in MATLAB? -

c# - Attempting to upload to FTP: System.Net.WebException: System error -

ios - UISlider customization: how to properly add shadow to custom knob image -