分类： javascript 2014-06-11 17:59 1676人阅读
转载来源：http://www.mhzg.net/a/20115/201151911240247.html
做项目的时候，有时候会遇到多表头的Grid，在EXTJS4中，多表头的实现已经很简单了，本文介绍如何实现多表头gird的功能。
做项目的时候，有时候会遇到多表头的Grid，在EXTJS4中，多表头的实现已经很简单了，本文介绍如何实现多表头gird的功能。
之前有一篇文章，讲的是如何实现Grid的分页功能（地址是：www.mhzg.net/a/20115/201151811170246.html），本文在此基础上做出修改，达到多表头Grid+分页功能。
先看下效果图：
实现代码如下：
HTML代码：
-
<!DOCTYPE html PUBLIC >
-
>
-
content=
type= href= />
-
src=></script>
-
src=></script>
-
src=></script>
-
></div>
-
</html>
group-header.js：
-
Ext.require([
-
,
-
,
-
,
-
-
function
,{
-
,
-
,,
-
-
,type: },
-
-
-
store = Ext.create(, {
-
-
,
-
-
,
-
-
,
-
,
-
,
-
-
-
-
,
-
-
-
-
grid = Ext.create(,{
-
,
-
,
-
, width: 120, dataIndex: , sortable: },
-
, width: 200, dataIndex: , sortable: },
-
, width: 100, dataIndex: , sortable: }]
-
, width: 100, dataIndex: , sortable: }
-
,
-
,
-
,
-
,
-
,
-
,
-
-
, {
-
,
-
,
-
-
JS代码要注意的地方：
1、记得载入‘Ext.util.*‘,
2、二级表头必须指定宽度，如果不指定的话，会提示错误。如图所示，红框里的项，必须要指定宽度。
服务端代码，这里使用ASP编写，具体解释请参考前一篇文章。
-
<%
-
-
-
‘返回JSON数据,自定义一些测试数据。。
‘这里的参数与EXT3.x相同，区别在于排序字段和排序方式使用了新的属性。
‘由于这里是测试数据，接收的参数只用到了start,limit。sorts和dir在实际操作过程中，将之加入SQL的ORDER BY里即可。
)
-
)
-
If
-
End
-
If
-
End
-
)),,)
-
)),,)
-
Dim
‘注意，这里的counts相当于Rs.RecordCount,也就是记录总数。
Dim
If
-
End
-
"{"
""":"
""&counts&","
""":["
For Ls
-
)
-
"title""newstitle"""
)
-
"author""author"""
)
-
"hits"""""
)
-
"addtime"""""
)
-
i<Ls
-
)
-
-
Next
"]}"
Function
End
-
%>
ExtJS4学习--多表头Grid
原文：http://www.cnblogs.com/shsgl/p/4776514.html
