表TD Rowspan不使用Ajax Jquery

表TD Rowspan不使用Ajax Jquery,jquery,html,asp.net,ajax,Jquery,Html,Asp.net,Ajax,请看看你是否能帮我。 代码: 我的期望输出 Month Category Days Jan CAT1 2 CAT2 3 CAT3 1 Feb CAT1 2 CAT2 3 Mar CAT3 1 但是ajax没有认出rowspan。。。请提供帮助您可以按以下方式更改代码: var th_table = $('#table-id'); var tmp

请看看你是否能帮我。 代码:

我的期望输出

Month   Category   Days
Jan     CAT1       2
        CAT2       3
        CAT3       1
Feb     CAT1       2
        CAT2       3
Mar     CAT3       1

但是ajax没有认出rowspan。。。请提供帮助

您可以按以下方式更改代码:

var th_table = $('#table-id');
var tmpMonth;
$(data).each(function (index, th) {
   var html = '';
   if (tmpMonth !== th.MONTHNAME) {
      html = '<tr>'
           + '<td rowspan="2" class="text-left">' + th.MONTHNAME + '</td>'
           + '<td class="text-left">' + th.CATEGORY + '</td>'
           + '<td class="text-left">' + th.NOOFDAYS + '</td>'
           + '</tr>';   
      tmpMonth = th.MONTHNAME;
   } else {
      html = '<tr>'
           + '<td class="text-left">' + th.CATEGORY + '</td>'
           + '<td class="text-left">' + th.NOOFDAYS + '</td>'
           + '</tr>';  
   }

   th_table.append(html);
});
请注意,数据必须按MONTHNAME排序

或者按MONTHNAME对数据进行分组,并循环分组结果

var groupedResult = _.groupBy(data, function(d) { return d.MONTHNAME; });
_.forEach(groupedResult, funcation(values, key) {
  // key is your MONTHNAME
  // values is an array
  html = '<tr>'
           + '<td rowspan="' + values.length + '" class="text-left">' + values[0].MONTHNAME + '</td>'
           + '<td class="text-left">' + values[0].CATEGORY + '</td>'
           + '<td class="text-left">' + values[0].NOOFDAYS + '</td>'
           + '</tr>';   
  th_table.append(html);

  for(var i = 1; i < values.length; i++ ){
    html = '<tr>'
           + '<td class="text-left">' + values[i].CATEGORY + '</td>'
           + '<td class="text-left">' + values[i].NOOFDAYS + '</td>'
           + '</tr>';   
    th_table.append(html);
  }

});

查看渲染输出TML,您的问题与Ajax无关您的意思是什么?只需右键单击您的网页并查看源代码,您会看到多少tbody?另一个问题:不应在循环中。问题与表有关,不是Ajax动态行跨度如何?可以使用lodash对数据进行分组并循环。稍后我会更新我的答案。
var th_table = $('#table-id');
var tmpMonth;
$(data).each(function (index, th) {
   var html = '';
   if (tmpMonth !== th.MONTHNAME) {
      html = '<tr>'
           + '<td rowspan="2" class="text-left">' + th.MONTHNAME + '</td>'
           + '<td class="text-left">' + th.CATEGORY + '</td>'
           + '<td class="text-left">' + th.NOOFDAYS + '</td>'
           + '</tr>';   
      tmpMonth = th.MONTHNAME;
   } else {
      html = '<tr>'
           + '<td class="text-left">' + th.CATEGORY + '</td>'
           + '<td class="text-left">' + th.NOOFDAYS + '</td>'
           + '</tr>';  
   }

   th_table.append(html);
});
var groupedResult = _.groupBy(data, function(d) { return d.MONTHNAME; });
_.forEach(groupedResult, funcation(values, key) {
  // key is your MONTHNAME
  // values is an array
  html = '<tr>'
           + '<td rowspan="' + values.length + '" class="text-left">' + values[0].MONTHNAME + '</td>'
           + '<td class="text-left">' + values[0].CATEGORY + '</td>'
           + '<td class="text-left">' + values[0].NOOFDAYS + '</td>'
           + '</tr>';   
  th_table.append(html);

  for(var i = 1; i < values.length; i++ ){
    html = '<tr>'
           + '<td class="text-left">' + values[i].CATEGORY + '</td>'
           + '<td class="text-left">' + values[i].NOOFDAYS + '</td>'
           + '</tr>';   
    th_table.append(html);
  }

});