首页 > 解决方案 > 如何使用 javascript 为我的表创建行跨度,该表具有来自 Zend Framework 中 sql 的数据

问题描述

输出

我想要的是在这种情况下有 2 次 Demo 正在打印,如果该列具有相同的名称,那么它应该是行跨度。我的数据是从 sql 中获取的,我已经使用 populate 方法和 forEach() 显示在网页上。这是我的代码。

function populateSubjectData(subjectDetail){
let table = `<form id="addExamSubjectForm" method="POST" enctype="multipart/form-data" action="javascript:;" autocomplete="off">
  <table class="table table-bordered" id="addExamSubject">`;
let header = `<tr>
                <th>Sr. No.</th>
                <th>Subject Name</th>
                <th>Sub Subject Name</th>
                </tr>`;

let body = "";

subjectDetail.forEach(function(subjectDetailObj, key){
  
 if(key == 0){
    console.log("1");
    
  }
  var prev = key;
  console.log(prev);
  var curr = key+1;
  console.log(curr);
  if(subjectDetail[prev].name === subjectDetail[curr].name){
    console.log("error");
      
    }
  else{
    console.log(subjectDetail[curr].name);
  }
  body +=`<tr>
              <td>${key + 1}</td>
              <td>${subjectDetailObj.name}</td>
              <td>${subjectDetailObj.subSubjectName}</td>
              
          </tr>`;
          
          
});
$('#subjectTable').html(table + header + body);

}

标签: javascriptjquery

解决方案


我的建议是:

  1. 通过按列名称对它们进行分组来构造服务器端获取的数据,所以你会得到类似的东西:

PARENT 1
  |_CHILD1
  |_CHILD2
PARENT 2
  |_CHILD1
  |_CHILD2
  |_CHILD3

  1. 在客户端(javascript)中,通过知道当前对象中的孩子数量,您可以制作一个rowspan,以防它是否有多个孩子。

希望对您有所帮助。


推荐阅读