layui table动态生成表头

在这里插入图片描述
实例

function productplantable(productname,years) {
		  //用来存放二级表头
			var cols = [];
			//这里的productdata是产品的list 类似与树结构 productname是图片中的产品名称 去重复了 productvariety是品种 这里的二级表头是根据 产品名称 筛选出来 按照自己的实际情况修改吧
			$.each(productdata,function(index,value){
			//开始组装表头
			if(value.productname == productname) {
				cols.push({field: value.id, title: value.productvariety,sort:'true',align:'center',width: 100});
					}
				});

		table.render({
			 elem: '#tablelist'
			,url: '${contextPath}/productoutputplan/getProductPlanListData' //数据接口
			,where: {productname: encodeURI(productname), years: years}
			,page: true //开启分页
			,toolbar: '#tabletoolbar'
			,defaultToolbar: []
	        ,cols: [[ //表头
		              {title: '序号',type:'numbers',rowspan:2}
				      ,{field: 'date', title: '时间',align:'center',sort:'true',rowspan:2,width: 150}
				      ,{title: '产出品种',align:'center',colspan:cols.length}
				      ,{field: 'total', title: '合计',align:'center',sort:'true',rowspan:2,width: 100}]
				      ,cols]
	        ,done: function (res, curr, count) {
	        	var tablemaindom = $("table[id=tablelist]").next().find(".layui-table-body.layui-table-main");
	        	$.each(res.data,function(index,value){
	        		var total = 0;
					//开始组装数据 这里是给单元格赋值
	        		$.each(value.listinfo,function(indexinfo,valueinfo){
	        			tablemaindom.find("tr[data-index="+value.LAY_TABLE_INDEX+"]").find(
	        					"td[data-field="+valueinfo.productid+"]").find(
	        							"div").text(valueinfo.outputplanvalue);
	        			total += valueinfo.outputplanvalue;
	        		});
	        		//合计
	        		tablemaindom.find("tr[data-index="+value.LAY_TABLE_INDEX+"]").find(
        					"td[data-field=total]").find(
        							"div").text(total);
				});

	        }
	        });
		
		}
  • 6
    点赞
  • 29
    收藏
    觉得还不错? 一键收藏
  • 6
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值