easyUI 动态生成表头，与动态绑定数据，实现代码

最新推荐文章于 2022-10-24 17:42:19 发布

原创

最新推荐文章于 2022-10-24 17:42:19 发布 · 置顶 · 5.9k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#easyui动态表头动态表格 #datagrid动态生成 #datagrid表格 #jquery datagrid #easyui datagrid

本文介绍了如何使用easyUI库动态生成表格的表头，并结合Ajax和jQuery实现数据的动态绑定。关键步骤包括通过Ajax请求获取表头信息，设置datagrid的columns属性，以及加载数据。示例代码展示了js、jsp和java层面的操作。

今天做了个动态生成表头的功能，和动态绑定数据。关键性代码如下，供大家参考

js 层面：

$.ajax({
url: "trustReportTemplateController.do?getAllTrustColumnChinese", //获取表头
type: "get",
contentType: "application/json",
dataType: "json",
data: {
temid:tempid,
pageTotal:3
},
error: function(response){
console.log("error");
},
success: function (data) {
var msg = JSON.parse(data.obj);
$("#dynamictDatagridList").datagrid({
columns: [msg.title] //动态取标题
});

getDataGridData();//加载数据
//$("#dynamictDatagridList").datagrid("loadData", msg.rows); //动态取数据
}
});

function getDataGridData(){

$.ajax({
url: "trustProjectManageController.do?getTrustProjectList",
type: "get",
contentType: "application/json",
dataType: "json",
data: {

},
error: function(response){
console.log("error");
},
success: function(response){
if(response.success){
var jsonarray=response.obj;
$("#dynamictDatagridList").datagrid({
&