【开发笔记】基于EasyUI框架，实现table列的动态绑定

最新推荐文章于 2022-08-05 15:12:15 发布

原创

最新推荐文章于 2022-08-05 15:12:15 发布 · 1.3k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#easyUI #c# #动态绑定列

本文介绍了如何使用EasyUI框架结合C#后台代码，实现表格列的动态绑定。根据后台返回的数据，前端可以动态加载和显示表格列，例如，当没有卖出商品时，相关列将不会显示。通过示例代码，展示了HTML、JS和C#的实现细节。

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

使用easyUI从后台获取字段，前台动态绑定

如下图效果，表头小区动态加载，如果没有卖出商品，就不显示，并且表头下方分栏显示

后台使用c#，Java代码也可以参考

不多说，直接上代码

html

<table id="PayReport" class="easyui-datagrid" style="width:auto;" toolbar="#toolbar"></table>

function QueryReportData() {
	// 字段数组
	var rowOne = [];	// 第一行
	var rowTwo = [];	// 第二行
	// 请求获取字段
	$.getJSON("url?param=1"), function (res) {
		if (res.result == 1) {
			// 取出data
			var jsonData = res.data;
			for (var i = 0; i < jsonData.length; i++) {
				for (var j = 0; j < jsonData[i].length; j++) {
					var col = {};
					col['title'] = jsonData[i][j].title;
					col['field'] = jsonData[i][j].field;
					col['rowspan'] = jsonData[i][j].rowspan;
					col['colspan'] = jsonData[i][j].colspan;
					col['ali