一个ext的grid分页栏显示不出来

[caishaolang]

//=======================这个是ext代码=========================

<script type="text/javascript">
	Ext.onReady(function(){
		Ext.QuickTips.init();// 浮动信息提示
		
		Ext.BLANK_IMAGE_URL = "@{'public/javascripts/resources/images/default/s.gif'}";
		
		//装载数据
		var ds = new Ext.data.Store({
		
			//数据源
			proxy : new Ext.data.HttpProxy({
   				url : '@{AdminPrograma.index()}'
  			}),
  			
			reader : new Ext.data.JsonReader(
				{
					//数据总数
					totalProperty : 'totalProperty',
					//数据
					root : 'root'
				},
				[
					//列
					{name: 'id'}, 
					{name: 'name'}
				]
			)
		});
		
		// 加载首页数据
		ds.load({
			params : 
			{
				start : 0,//当前页数
				limit : 10//每页显示的数量
			}
		});
		
		//定义复选框
		var sm = new Ext.grid.CheckboxSelectionModel();
		
		//列名
		var cm = new Ext.grid.ColumnModel([
			new Ext.grid.RowNumberer(),
			sm,// 添加复选框?
			{
				header : '编号',
				dataIndex : 'id'
			},
			{	
				header : '姓名',
				dataIndex : 'name'
			}
		]);

		var grid = new Ext.grid.GridPanel({
			id : 'student-grid',// 设置标识ID，方便以后引用！
			
			title : '人员信息管理?',// 标题
			
			renderTo : 'grid',// 显示表格的地方显示表格的地方
			
			sm : sm,// 复选框
			
			cm : cm,// 列模型
			
			ds : ds,// 数据源
			
			stripeRows : true,// 加上行条纹
			
			loadMask : true,// 加载数据时遮蔽表格
			
			border : true,// 加上边框
			
			frame : true,// 显示天蓝色圆角框
			
			
			stripeRows:true,
			
		    loadMask:true,
		    
		    autoExpandColumn:'date',
		    
		    autoHeight:false,
		    
			width : 700,
			
			height : 400,
			
			x : 1,// 设置初始位置横坐标?
			
			y : 1,// 设置初始位置纵坐标?
			
			collapsible : true, // 面板可以折叠
			
			// 表格底部分页工具栏
			bbar: new Ext.PagingToolbar({
				pageSize:10,
				store:ds,
				displayInfo:true,
				displayMsg:'显示第{0}条 到 {1}条记录，一共 {2} 条',
				emptyMsg:"没有记录"
    		}),
			
			//让列充满表格
			viewConfig:{
				forceFit:true ,
				enableRowBody: true ,
				scrollOffset:15,
				displayInfo: true,
				columnsText:'显示的列'
		    }
		});
 	});
</script>

//=======================这个是后台 java=========================

public static String index(Integer start, Integer limit){
		
		List<Product> products = Product.findAll();
		String root ="root:[";
		String totalProprerty = "totalProperty : 100";
		String ds = "";
		for (Product product : products) {
			root += "{id:'" + product.getId() + "', name:'" + product.getName() +"'},";
		}
		//删除最后逗号 并加上中括号
		root = root.substring(0, root.length() - 1) + "]";
		
		ds = "{" + totalProprerty + "," + root + "}";
		
		Logger.debug(ds);
		
		return ds;
                  //输出时这样的 {totalProperty : 100,root:[{id:'17', name:'砖石手表'},{id:'18', name:'釜山手表'}]}
	}

结果效果变成这样了

[caishaolang]

有哪位好心人帮帮忙 小弟对这个问题困了2天了⊙﹏⊙b汗

[caishaolang]

难道是我标题不好 无人关顾 Orz

[shixitong]

图片变为啥样？你在前台输出ds看看有没有数据啊？

[softroad]

http://topic.csdn.net/u/20110811/13/736b88e4-5aba-4e8d-8233-fa074c9e3976.html

[caishaolang]

图片在最下面有贴了

ds:
{totalProperty : 100,root:[{id:'17', name:'砖石手表'},{id:'18', name:'釜山手表'},{id:'19', name:'百达翡丽'},{id:'20', name:'爱彼'},{id:'21', name:'伯爵'},{id:'22', name:'积家Jaeger-Le Coulter'},{id:'23', name:'劳力士'},{id:'24', name:'卡地亚'},{id:'25', name:'万国 IWC'},{id:'26', name:'芝柏IRARD-PERREGAUX'},{id:'27', name:'欧米茄'},{id:'28', name:'劳力'},{id:'29', name:'高级雨伞'},{id:'34', name:'oo项链'},{id:'35', name:'舌头帽'},{id:'36', name:'墨镜'},{id:'37', name:'太阳镜'},{id:'38', name:'紫色眼镜'},{id:'43', name:'时尚墨镜'},{id:'45', name:'彩色墨镜'},{id:'46', name:'儿童墨镜'},{id:'47', name:'呵呵墨镜'},{id:'48', name:'iPhone4'},{id:'49', name:'尿不湿'},{id:'53', name:'Saber'},{id:'54', name:'(～ o ～)Y'},{id:'55', name:'劳力'},{id:'56', name:'劳力'}]}

[caishaolang]

我刚用ext 很不熟 有问题就卡个好久

[caishaolang]

不知道是不是数据源的问题 大家帮忙看下后台有没有问题啊