今天在做项目的时候碰到这个问题,和大家一起分享:
源代码:大家一定需要注意我的Store中的sortInfo:
<script type="text/javascript">
Ext.onReady(function(){
Ext.QuickTips.init();
//别名
var xg=Ext.grid;
//创建一个ArrayReader
var reader=new Ext.data.ArrayReader({},[
{name:"name",type:"string"},
{name:"age",type:"int"},
{name:"empno",type:"int"},
{name:"sex",type:"int"},
{name:"birthday",type:"date",dateFormat:"n/j h:ia"},
{name:"salary",type:"float"},
{name:"deptno",type:"int"}
]);
//创建一个store
var store=new Ext.data.GroupingStore({
reader:reader,
data:xg.dummyData,
sortInfo:{field:"company",direction:"ASC"},
groupField:"deptno" //根据部门来分组
});
//name的renderer
function nameCls(val){
if(val.length>2){
return "<span stype='color:red;'>"+val+"</span>";
}
return "<span stype='color:blue;'>"+val+"</span>";
}
//age的Cls
function agCls(val){
if(val>25){
return "<span stype='color:red;'>"+val+"</span>";
}
return "<span stype='color:green;'>"+val+"</span>";
}
//创建一个gridPanel
var grid=new xg.GridPanel({
store:store,
columns:[
{header:"姓名",width:20,sortable:true,renderer:nameCls,dataIndex:"name"},
{header:"年龄",width:40,sortable:true,renderer:agCls,dataIndex:"age"},
{id:"empno",header:"编号",width:60,sortable:true,dataIndex:"empno"},
{header:"性别",width:20,sortable:true,dataIndex:"sex"},
{header:"生日",width:50,sotrable:true,renderer:Ext.util.Format.dateRenderer("m/d/Y"),dataIndex:"birthday"},
{header:"工资",width:30,sortable:true,renderer:Ext.util.Format.usMoney,dataIndex:"salary"},
{header:"部门编号",width:50,sortable:true,dataIndex:"deptno"}
],
view:new Ext.grid.GroupingView({
forceFit:true,
groupTextTpl:"{text} ({[values.rs.length]} {[values.rs.length>1 ? 'Items' : 'Item']})"
}),
frame:true,
width:700,
height:450,
collapsible:true,//True表示为面板是可收缩的,并自动渲染一个展开/收缩的轮换按钮在头部工具条。false表示为保持面板为一个静止的尺寸
animCollapse:true,//True 表示为面板闭合过程附有动画效果(默认为true,在类 Ext.Fx 可用的情况下)。
title:"雇员信息",
iconCls:"icon-grid",
fbar:["->",{
text:"clear Groping",
iconCls:"icon-clear-group",
handler:function(){
store.clearGouping();
}
}],
renderTo:document.body
});
});
//数据
Ext.grid.dummyData=[
["张三00",12,1001,1,"1990-05-20",3000,50],
["张三01",16,1002,0,"1990-05-21",3000,20],
["张三02",19,1003,1,"1990-05-22",3000,20],
["张三03",25,1004,1,"1990-05-23",3000,10],
["张三04",22,1005,1,"1990-05-24",3000,30],
["张三05",24,1006,1,"1990-05-25",3000,20],
["张三06",23,1007,0,"1990-05-26",3000,60],
["张三07",21,1008,0,"1990-05-27",3000,90],
["张三08",25,1009,0,"1990-05-28",3000,10],
["张三09",28,1010,1,"1990-05-29",6000,20],
["张三20",26,1011,0,"1990-05-20",2000,50],
["张三21",29,1012,0,"1990-06-20",8000,40],
["张三22",22,1013,1,"1990-01-20",3000,50],
["张三23",28,1014,0,"1990-02-20",3000,60],
["张三24",21,1015,1,"1990-08-20",3000,50]
];
</script>
错误就出现在那里,没有company列但是,我却给company列排序所以报错,
找了很长时间,特地贴出来,不知道对大家有没有帮助.