extjs grid的问题。this.el.dom为空或不是对象。
代码如下<html><head><metahttp-equiv="Content-Type"content="text/html;chars...
代码如下<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK"> <title>Hello World</title> <link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css" /><!--这一个是引入ExtJs的默认样式--><script type="text/javascript" src="../adapter/ext/ext-base.js"></script><script type="text/javascript" src="../ext-all.js"></script><!--ExtJs所需要的核心脚本全部都在这两个js文件中。--><script type="text/javascript"> var cm = new Ext.grid.ColumnModel([ {header:'编号',dataIndex:'id'}, {header:'名称',dataIndex:'name'}, {header:'描述',dataIndex:'descn'} ]); var data = [ ['1','name1','descn1'], ['2','name2','descn2'], ['3','name3','descn3'], ['4','name4','descn4'], ['5','name5','descn5'] ]; var ds = new Ext.data.Store({ proxy: new Ext.data.MemoryProxy(data), reader: new Ext.data.ArrayReader({}, [ {name: 'id'}, {name: 'name'}, {name: 'descn'} ]) }); ds.load(); var grid = new Ext.grid.GridPanel('grid', { ds: ds, cm: cm }); grid.render();</script></head> <body> <div id="grid"></div></body> </html> 运行时候报错 this.el.dom为空或不是对象。不是菜鸟,初步接触extjs grid,根据文档学习,学习到extjs grid,文档DEMO不能运行,苦于无从寻求答案。不要分析,不要网上资料,examples里面的也不要,只要一个能运行的清晰的DEMO,其他的我自己会研究。采纳后加100分。
展开
2个回答
展开全部
排版看起来真的有点蛋疼啊,我运行了下,也是一样的问题,原因是你的ExtJs代码未被触发,页面载入后自然找不到对象,一般是把EXTJS写在Ext.onReady(function(){})里面的,还有一个小错误是grid.render也是需要有DOM对象的,你的render对象为空的话grid就找不到附着的地方了。我修改了下你的代码如下便可以运行了,希望能帮到楼主。
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Hello World</title>
<link rel="stylesheet" type="text/css"href="../resources/css/ext-all.css" /><!--这一个是引入ExtJs的默认样式-->
<script type="text/javascript" src="../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext-all.js"></script><!--ExtJs所需要的核心脚本全部都在这两个js文件中。-->
<script type="text/javascript">
Ext.onReady(function(){
var cm = new Ext.grid.ColumnModel( [ {
header : '编号',
dataIndex : 'id'
}, {
header : '名称',
dataIndex : 'name'
}, {
header : '描述',
dataIndex : 'descn'
} ]);
var data = [
[ '1', 'name1', 'descn1' ],
[ '2', 'name2', 'descn2' ],
[ '3', 'name3', 'descn3' ],
[ '4', 'name4', 'descn4' ],
[ '5', 'name5', 'descn5' ] ];
var ds = new Ext.data.Store( {
proxy : new Ext.data.MemoryProxy(data),
reader : new Ext.data.ArrayReader( {}, [ {
name : 'id'
}, {
name : 'name'
}, {
name : 'descn'
} ])
});
ds.load();
var grid = new Ext.grid.GridPanel({
ds : ds,
cm : cm,
autoHeight:true//此处可保证每行都显示出来
});
grid.render("grid");
})
</script>
</head>
<body>
<div id="grid"></div>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Hello World</title>
<link rel="stylesheet" type="text/css"href="../resources/css/ext-all.css" /><!--这一个是引入ExtJs的默认样式-->
<script type="text/javascript" src="../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext-all.js"></script><!--ExtJs所需要的核心脚本全部都在这两个js文件中。-->
<script type="text/javascript">
Ext.onReady(function(){
var cm = new Ext.grid.ColumnModel( [ {
header : '编号',
dataIndex : 'id'
}, {
header : '名称',
dataIndex : 'name'
}, {
header : '描述',
dataIndex : 'descn'
} ]);
var data = [
[ '1', 'name1', 'descn1' ],
[ '2', 'name2', 'descn2' ],
[ '3', 'name3', 'descn3' ],
[ '4', 'name4', 'descn4' ],
[ '5', 'name5', 'descn5' ] ];
var ds = new Ext.data.Store( {
proxy : new Ext.data.MemoryProxy(data),
reader : new Ext.data.ArrayReader( {}, [ {
name : 'id'
}, {
name : 'name'
}, {
name : 'descn'
} ])
});
ds.load();
var grid = new Ext.grid.GridPanel({
ds : ds,
cm : cm,
autoHeight:true//此处可保证每行都显示出来
});
grid.render("grid");
})
</script>
</head>
<body>
<div id="grid"></div>
</body>
</html>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询