首页 > ExtJs > ExtJs 可编辑grid不显示列表内容

ExtJs 可编辑grid不显示列表内容

2009年12月1日 逝去的风 发表评论 阅读评论

刚开始学习ExtJs,不可避免的会遇到各种各样的问题，包括很低级的问题，这不，我今天就遇到一个。首先给你看一段代码，你认为运行结果是什么呢？
ExtJs

代码1

Ext.onReady(function(){	
	var store1 = new Ext.data.JsonStore({
		url:'test.php',
		root:'rows',
		fields:['id','name']		
	});
	store1.load();	
	var colModel = new Ext.grid.ColumnModel([{header:"id",dataIndex:"id"},{header:"name",dataIndex:"name"}]);
	var grid = new Ext.grid.EditorGridPanel({
		cm:colModel,
		store:store1,
		renderTo:Ext.getBody()
	});	
});
告诉你，上面的代码运行结果是，不管你后台能不能返回来数据，都只是显示出grid的标题，而不会显示grid的记录。

为什么呢？我可是在extJs群中问过，与别人讨论过，最后结合这些资源，我发现了问题所在。先不说，你看下面的代码
代码2

Ext.onReady(function(){	
	var store1 = new Ext.data.JsonStore({
		url:'test.php',
		root:'rows',
		fields:['id','name']		
	});
	store1.load();	
	var colModel = new Ext.grid.ColumnModel([{header:"id",dataIndex:"id"},{header:"name",dataIndex:"name"}]);
	var grid = new Ext.grid.EditorGridPanel({
		cm:colModel,
		store:store1,	
		height:300,
		renderTo:Ext.getBody()
	});	
});
上面这段代码就能正确显示结果了，你看出来不同的地方了吗？
我相信细心的同学应该已经看出来，height:300,代码2 多了这一行。不错，就是这么简单。
我借助firedebug，发现，代码1其实也成功将后来数据取到了，只是没有显示，因为你没有给他指定高度，所以，ExtJs给他的高度就是0了，所以你就看不到列表数据了。

天天成长的博客希望能帮到你！

分类: ExtJs 标签:
  1. 本文目前尚无任何评论.
  1. 本文目前尚无任何 trackbacks 和 pingbacks.