easyUI datagrid表头的合并

最新推荐文章于 2024-09-06 10:02:37 发布

weixin_30389003

最新推荐文章于 2024-09-06 10:02:37 发布

阅读量872

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/wgl0126/p/9394731.html

本文介绍了一段用于初始化配置表格的JavaScript代码，该代码使用了easyui框架的数据表格插件，展示了如何设置表格的样式、列定义及数据加载方式等关键属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

图列：

js代码

function initConfigTable(param){
	$("#mulConfigureTableBox").empty();
	$("#mulConfigureTableBox").append('<table id="mulConfigureTable" style="margin:0;padding:0;"></table>')
	$("#mulConfigureTable").datagrid({
		url:url,
		title : false,
		fit : true,
		fitColumns : false,//设置为 true，则会自动扩大或缩小列的尺寸以适应网格的宽度并且防止水平滚动
		striped :true,//奇偶行的颜色
		border : true,
		loadMsg : '正在加载数据，请稍候...',
		singleSelect:false,
		autoRowHeight:true,
		rownumbers:false,
		showFooter:false,
		resizable : false,
		pagination:true,
		pageSize:10,
		pageList : [10,15,20,25,30,35,40,45,40,100],
		queryParams:param,//查询条件
		frozenColumns:[[
			{
				title : '区域',
				field : 'city',
				align:'center',
				width:70,
				sortable : false
			},
			{
				title : '设备层级',
				field : 'level',
				align:'center',
				width:70,
				sortable : false
			},
			{
				title : '设备名称',
				field : 'deviceName',
				align:'center',
				width:240,
				sortable : false
			},
			{
				title : '设备IP',
				field : 'ipaddress',
				align:'center',
				width:100,
				sortable : false
			}
		]],
		columns:[[
			{
				title : 'PB MB MC',
				align:'center',
				"colspan":1
			},
			{
				title : 'PB',
				align:'center',
				"colspan":1
			},
			{
				title : 'PB',
				align:'center',
				"colspan":1
			},
			{
				title : 'PB MB MC',
				align:'center',
				"colspan":1
			}],
			[{
				title : '组播使能',
				field : 'mineStatus1',
				align:'center',
				formatter:formatterFun,
				width:100,
				sortable : false
			},
			{
				title : 'Anycast-RP<br/>是否配置',
				field : 'mineStatus2',
				align:'center',
				formatter:formatterFun,
				width:100,
				sortable : false
			},
			{
				title : 'MSDP配置',
				field : 'mineStatus3',
				align:'center',
				formatter:formatterFun,
				width:100,
				sortable : false
			},
			{
				title : '组播负载均衡',
				field : 'mineStatus4',
				align:'center',
				formatter:formatterFun,
				width:100,
				sortable : false
			}
		]]		
	})
}

转载于:https://www.cnblogs.com/wgl0126/p/9394731.html