其实这是我犯的最低级的错误,我在火狐上运行,firebug没有报错,而后台的数据能正常获取,但是extjs就是不能显示.
<script type="text/javascript">
Ext.onReady(function(){
//创建一个store
var store=new Ext.data.Store({
//从服务器端加载
url:"ext/xml/Employee.xml" ,
reader:new Ext.data.XmlReader({
//是以那个标签为一记录的
record:"employee",
id:"empno",
totalRecords:"@total"
},[
{name:"empno"},
{name:"name"},
{name:"job"},
{name:"birthday",type:"date",dateFormat:"Y-m-d"},
{name:"salary"},
{name:"comm"},
{name:"dname" ,mapping:"dept > dname"},
{name:"loc" ,mapping:"dept > loc"},
{name:"deptno" ,mapping:"dept > deptno"}
])
});
//创建一个grid
var grid=new Ext.grid.GridPanel({
store:store,
columns:[
{id:"empno",header:"编号",width:120,dataIndex:"empno",sortable:true},
{header:"姓名",width:120,dataIndex:"name",sortable:true},
{header:"工作",width:120,dataIndex:"job",sortable:true},
{header:"生日",width:140,dataIndex:"birthday",sortable:true,renderer:Ext.util.Format.dateRenderer("Y/m/d")},
{header:"工资",width:120,dataIndex:"salary",sortable:true,renderer:Ext.util.Format.usMoney},
{header:"奖金",width:120,dataIndex:"comm",sortable:true,renderer:Ext.util.Format.usMoney},
{header:"部门名称",width:110,dataIndex:"dname",sortable:true},
{header:"位置",width:120,dataIndex:"loc",sortable:true},
{header:"部门编号",width:120,dataIndex:"deptno",sortable:true}
],
sm:new Ext.grid.RowSelectionModel({singleSelect:true}),
viewConfig:{
forceFit:true
},
height:210,
split:true,
region:"north"
});
//定义显示详细信息模版
var bookTplMarkup=[
'部门编号:{deptno}<br/>',
'部门名称:{dname}<br/>',
'位置:{loc}<br/>'
];
//创建模版
var bookTpl=new Ext.Template(bookTplMarkup);
//创建panel
var ct=new Ext.Panel({
render:"binding-example",
frame:true,
title:"Book List",
width:540,
height:400,
layout:"border",
items:[
grid,
{
id:"detailPanel",
region:"center",
bodyStyle:{
background:"#ffffff",
padding:"7px"
},
html:"测试的显示的信息"
}
]
});
grid.getSelectionModel().on("rowselect",function(sm,rowIndex,r){
//得到panel对象
var detailPanel=Ext.getCmp("detailPanel");
bookTpl.overwrite(detailPanel.body,r.data);
});
//手动调用加载
store.load({callback:function(){
// alert(Ext.util.JSON.encode(store.getAt(0).data));
}});
});
</script>
注意看代码的这里,我也没想到会犯这么低级错误,所以检查错误的时候需要仔细.
仔细看这里:
之中的renderTo写成了render,火狐是不会报错的.也不显示,