easyui datagrid自定义表头

第一种实现方法:

实现界面:


html代码:


js代码:

$('#tt').treegrid({
				url: '/cost/getInfo.do',
				method: 'get',
				queryParams:{year:y},
				autoRowHeight:true,
				animate:true,
				lines:true,
				height:425,
				fitColumns:true,
				idField: 'subjectId',
				treeField: 'subjectName',
				onLoadSuccess: function () { $('#tt').treegrid('collapseAll'); },
				 columns:[[
				{field:'subjectName',title:'科目名称',width:220,align:'left',styler:function(){return 'height:30px;';}},
				{field:'realTotal',title:real_Budget,width:200,align:'right'},
			    	{field:'planTotal',title:plan_Budget,width:200,align:'right'},
				{field:'completeRate',title:'达成率',width:200,align:'right'}
				
				
		    ]]
		});

第二种方法:

实现界面


html代码:

科目 $query.month月 YTD累计1-$query.month月 FY年度
实际 预算 预算达成率(%) 实际 预算 预算达成率(%) 预算 预算达成率(%)

js代码:

$('#reportDetail').treegrid({
            url: '/AAAA/BBB.do',
            method: 'get',
            queryParams:{year:y,month:m,deptTwo:t},
            autoRowHeight:true,
            animate:true,
            lines:true,
            height:425,
            idField: 'subjectId',
            treeField: 'subject',
            onLoadSuccess: function () {
                $('#reportDetail').treegrid('collapseAll');
                $("table.datagrid-htable tr:eq(0) td:eq(1) .datagrid-cell-group").text(m+"月");
                $("table.datagrid-htable tr:eq(0) td:eq(2) .datagrid-cell-group").text("YTD累计1-"+m+"月");
            }

        });


你可能感兴趣的:(easyui datagrid自定义表头)