easyui中datagrid动态生成列(动态formatter)

需求: 客户需要按照月份查出当月所有天数的数据
解析需求: 后台需要拿到动态生成的数据(我们是用存储过程生成或者函数),前台进行拼接
前台实现: 取到对应的天数,然后初始化字段,接着加载数据

function dynamicLoad(){
			//拿到月份,需要只选取年和月份的插件可以找我
			var month = $("#query_month").datebox("getValue");
			if(month==""){
				$.msg.alert("请选择月份");
				return;
			}
			var dateArray = month.split("-");
			//必须以这种方式传入日期,否则获取不到对应月份的天数 如果是new Date(''2020-01-01")
			这样取不到对应的天数,取得值是1,也就是你传入日期的日,所以只能是new date(年,月,0)
            var date = new Date(dateArray[0], dateArray[1], 0);
            var days = date.getDate();
            var startTime = month+"-01";
            var endTime = month+"-"+days;
			var columns=new Array();
			$.post(url,{startTime:startTime,endTime:endTime},function(rs){
				//获取存储当前日期
				var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
				for(var i = 0; i < rs.dates.length;i++){
					var date = rs.dates[i];
					var mydate=new Date(date.signDate);
					var myddy=mydate.getDay();
			 		var column={};
				 	column["title"]=dateFormatter(date.signDate)+"<br/>"+weekday[myddy];
				 	column["field"]='date'+i;
				 	column["width"]=120;
				 	column["align"]='center';
				 	columns.push(column);
			    }
			    //如果需要格式化值,这步很关键,网上找的说拼接字符串,我也不知道怎么弄,
			    所以我直接这样写,{}里面拼接字符串我也不会,所以你把你需要formatter的字段做个判断,然后初始化column的值
				var column={'formatter':function(val,row,index) {return (val*100).toFixed(2)}};
				column["title"]="平均值"
				column["field"]='avg';
				column["width"]=120;
				column["align"]='center';
				columns.push(column);
				init(columns);
				$("#data_list").datagrid('loadData',rs.datas);
			 }
			,'json');
			 
		}
	
	//这部分就是初始化表格字段
		function init(columns){
			$("#data_list").datagrid( {
				idField : 'id',
				cache : false,
				method : "post",
				rownumbers : true,
				nowrap: false,
				border : false,
				fit : true,
				fitColumns: false,
				toolbar : "#toolbar",
				striped : true,
				pagination : true,
				pageList : [ 100,200,500,1000 ],
				singleSelect : false,
				enableHeaderClickMenu: false,        
		        enableHeaderContextMenu: false,      
		        enableRowContextMenu: true,
		        frozenColumns :[[{field:'userName',title:'人员',width:100,sortable:true,align:'center'}, {field:'vgroup',title:'班次',width:100,sortable:true,align:'center'}]],
		        columns : [columns],
		        onBeforeLoad : function(){$("#data_list").datagrid('clearSelections');return true;},
		        onLoadSuccess:function(data){
		        },
		        onSelect:function(rowIndex,rowData){ buttonState();
	  			},
	  			onUnselect:function(rowIndex,rowData){ buttonState();
	  			},
	  			onSelectAll:function(rows){ buttonState();
	  			},
	  			onUnselectAll:function(rows){ buttonState();
	  			},
			});
		}

如果以上内容对你有帮助,可以的话打个赏,多少无所谓,就是让我感觉到你们的心意,如果又不懂的,欢迎评论,我一定知无不言,言无不尽,还是说一句,还是vue好用,easyui我也是用来维护老项目写的,用的很多,哈哈,最后感谢你们的阅读。

  • 4
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值