去年毕业，在公司一直做C/S的软件，最近工作不是很忙，就自己学习了下Extjs4
问题如标题所示。报错信息：
TypeError: Argument 1 of Node.insertBefore is not an object.
我是用的desktop + Extjs提供的mvc 做的。
下面贴出部分代码
controller
init:function(){
var self=this;
coreApp=self;
this.addFunItem=function(funInfo){//动态加载controller并渲染它的主窗体
if(funInfo){
var mainView=funInfo.mainView;
//var funPanel=mainView.down(funInfo.funViewXtype);
var funPanel=Ext.ComponentQuery.query(funInfo.funViewXtype)[0];
if(!funPanel){
this.application.getController(funInfo.funController).init();
funPanel=Ext.create(funInfo.funViewName);
mainView.add(funPanel);
mainView.setActiveTab(funPanel);
}else{
mainView.setActiveTab(funPanel);
}
}
},
this.control({
'menuView treepanel[id="Clgl30000"]':{//查询 菜单树 添加单击事件
itemclick:function(tree,record,item,index,e,options){
var mainView=Ext.getCmp("centerpanel");//得到中间的 tabpanel 组件
if('Clgl30300'==record.data["fmenubh"]){// 单据查询
this.addFunItem({
mainView:mainView,
funViewXtype:'djQueryView',
funController:'core.app.controller.DjQueryController',
funViewName:'core.app.view.DjQueryView'
});
}
}
}
});
view
/**
*/
Ext.define('core.app.view.DjQueryView',{
extend:'Ext.panel.Panel',
closable:true,
alias:'widget.djQueryView',
id:'DjQueryView',
title:'单据查询',
layout:'border',
defaults: {
// collapsible: true,
// split: true,
bodyStyle: 'padding:0px'
},
tbar: [
{text:'查询',id:'query',iconCls:'dept_table'},
{text:'导出',id:'export',iconCls:'table_add'},
{text:'打印',id:'print',iconCls:'table_remove'},
{text:'退出',id:'exit',iconCls:'table_remove',handler:function(btn){
btn.ownerCt.ownerCt.destroy( );
}}
],
items:[
{
xtype: 'container',
height:90,
region: 'north',
layout:'absolute',
// style: {borderColor:'#000000', borderStyle:'solid', borderWidth:'1px'},
defaults: {
labelWidth: 60,
flex: 1,
style: {
padding: '5px'
}
},
items: [
{
xtype:'fieldset',
title: '查询范围选择',
frame:true,
collapsible: true,
defaults: {anchor: '100%'},
layout: 'anchor',
width:180,
height:80,
items :[
{
fieldLabel:'仓库',labelWidth:30,
width:150,
xtype:'combobox',id:'fckbh',
store:'TclckStore', displayField: 'fmc',
valueField: 'fckbh',value:'10001',//默认选择10001仓库
editable : false// 是否可编辑
}
],
x:0,
y:0
},
{
xtype:'fieldset',
title: '日期区间选择',
collapsible: true,
defaultType: 'datefield',
defaults: {
labelWidth:55,
labelSeparator:':',
labelAlign:'left'
},
width:200,
height:80,
layout: 'absolute',
items :[{
fieldLabel: '开始日期',
format:'Y-m-d',
name: 'begDate',
autoFitErrors:false,
x:0,
y:0,
width:180,
value:Ext.Date.format(new Date(),'Y-m-d')
}, {
fieldLabel: '结束日期',
format:'Y-m-d',
name: 'endDate',
autoFitErrors:false,
x:0,
y:30,
width:180,
value:Ext.Date.format(new Date(),'Y-m-d')
}],
x:190,
y:0
}
]
},{
xtype:'djQueryTable',
frame:true,
region: 'center',
autoScroll:true
//style: {borderColor:'#000000', borderStyle:'solid', borderWidth:'1px'}
//title:'panel'
}
],
initComponent: function() { //初始化组件函数
this.callParent(arguments)//调用父类构造函数
var com=Ext.ComponentQuery.query('combobox',this)[0];
var store=com.store;
store.load(function(records, operation, success) {
com.select(store.getAt(0));
});
}
});
view 中包含的 grid
/**
*/
Ext.define('core.app.view.DjQueryTable',{
extend:'Ext.grid.Panel',
alias:'widget.djQueryTable',
columnLines:true,
autoScroll:true,
columns:[
{header:'单据id',dataIndex:'fdjid'},
{header:'单据编号',dataIndex:'fdjbh'},
{header:'材料编号',dataIndex:'fclbh'},
{header:'仓库编号',dataIndex:'fckbh'},
{header:'基本数量',dataIndex:'fjbsl'},
{header:'入库批号',dataIndex:'frkph'},
{header:'进货单价',dataIndex:'fjhdj'},
{header:'零售单价',dataIndex:'flsdj'},
{header:'进货金额',dataIndex:'fjhje'},
{header:'零售金额',dataIndex:'flsje'}
],
store:'DjQueryStore',
initComponent: function() { //初始化组件函数
this.paging={//依靠父类构造 生成组件 所以写在 callParent 之前
xtype:'pagingtoolbar',
store:'DjQueryStore',
dock:'bottom',
displayInfo:true
}
this.dockedItems=[this.paging];
var arr=[
Ext.create('Ext.grid.RowNumberer',{
header:'序号',
renderer: function(value,metadata,record,rowIndex){
return '<font color="red">'+rowIndex+'</font>';
}
})
];
Ext.Array.insert(this.columns,0,arr);
this.callParent(arguments);//调用父类构造函数
}
});
问题就出在 grid 中，不知道为什么，
我刚开始将分页插件 配置在dockedItems 运行之后就出现 页面关闭后再打开报这个错
然后我将 分页插件放到 构造方法里面就好了。
但是我在columns添加RowNumberer 就又出现了,
换到构造函数始终添加也不行。
求各路大神帮看下，很是困惑啊。
刚试了下
在grid 的columns 中重新配置成
columns:[
{xtype:'rownumberer',
header:'序号',
renderer: function(value,metadata,record,rowIndex){
return '<font color="red">'+rowIndex+'</font>';
}},
{header:'单据id',dataIndex:'fdjid'},
{header:'单据编号',dataIndex:'fdjbh'},
{header:'材料编号',dataIndex:'fclbh'},
{header:'仓库编号',dataIndex:'fckbh'},
{header:'基本数量',dataIndex:'fjbsl'},
{header:'入库批号',dataIndex:'frkph'},
{header:'进货单价',dataIndex:'fjhdj'},
{header:'零售单价',dataIndex:'flsdj'},
{header:'进货金额',dataIndex:'fjhje'},
{header:'零售金额',dataIndex:'flsje'}
],
这样就 OK了。
但是 我在构造方法中
var arr=[
/*Ext.create('Ext.grid.RowNumberer',{
header:'序号',
renderer: function(value,metadata,record,rowIndex){
return '<font color="red">'+rowIndex+'</font>';
}
})*/
{
xtype:'rownumberer',
header:'序号',
renderer: function(value,metadata,record,rowIndex){
return '<font color="red">'+rowIndex+'</font>';
}
}
];
Ext.Array.insert(this.columns,0,arr);
这样 每次关闭后再打开 就会多加一列序号。
我在 view 中的 CloseAction 没有设置 API中说 默认应该是 destory才对的啊
销毁后再构造 多一列 说明之前没有销毁啊
还是满困惑。。。