dhtmlx学习之dhtmlxgrid（三）---列表多表头

小古墓

浏览: 58300 次
性别:
来自: 山东

最近访客更多访客>>

kindhyh

plxddyxnmd

Cadelle

joyer2005

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

dhtmlx

dhtmlx dhtmlxgrid attachHeader

最终效果：

知识点：

attachHeader(values, style)

values - 表头标题数组
style - 样式选项数组

我的代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Dhtml Grid</title>
<link rel="STYLESHEET" type="text/css" href="<%=path %>/js/dhtml/dhtmlx.css">

</head>
<body>

	<div id="mygrid_container" style="width:600px;height:150px;"></div>
	
	<script src="<%=path %>/js/jquery-1.5.1.js"></script>
	<script src="<%=path %>/js/dhtml/dhtmlxcommon.js"></script>
	<script src="<%=path %>/js/dhtml/dhtmlx.js"></script>
	<script src="<%=path %>/js/dhtml/dhtmlxgrid.js"></script>
	<script type="text/javascript">
	    var mygrid;
	    $(document).ready(function(){
	    	
	    	mygrid = new dhtmlXGridObject("mygrid_container");
	    	
	    	mygrid.setImagePath("<%=path%>/image/dhtml/");

               <!--设置表头-->
	    	mygrid.setHeader("人员信息,#cspan,#cspan,出生日期,全国,#cspan,合计");
	    	 <!--设置二级表头-->
	    	 mygrid.attachHeader(["姓名", "编码", "性別", "#rspan","价格","数量", "#rspan"]);
	    	 
	    	 mygrid.setInitWidths("200,100,50,200,100,100,*");
	    	
	    	 mygrid.setColAlign("left,left,left,center,right,right,right");
	    	
	    	 mygrid.setColSorting("str,int,str,date,int,int,int");
	    	 
	    	 mygrid.setColTypes("edtxt,ed,ro,dhxCalendar,ron,ron,ron");
	    	
	    	mygrid.enableMultiselect(true);
	    	
	    	mygrid.setSkin("dhx_skyblue");
	    	
	    	mygrid.attachEvent("onRowSelect",doOnRowSelected);
	    	
	    	mygrid.init();
	    	
	    	mygrid.setNumberFormat("0,000.00",3,",","."); 
	    	
	        mygrid.loadXML('<%=path%>/student/dhtmlListStudent.do?vmTemplate=index2.vm');
	    	
	    });
	    
	   

	</script>
</body>
</html>

#cspan：列合并