extjs 不显示但是不报错

其实这是我犯的最低级的错误,我在火狐上运行,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,火狐是不会报错的.也不显示,

posted @ 2012-03-29 11:52 Java EE 阅读(321) 评论(0) 编辑收藏举报

刷新页面返回顶部

Java EE

extjs 不显示 但是不报错

公告

extjs 不显示但是不报错