修改

Question

我的项目有困难......

我想将jquery循环的结果放入动态表（特定月份和年份）。

首先，我构建了JSON，结果如下：

https://jsoneditoronline.org/?id=eb05e512b80a4995b3f6d0425b813dd9

然后我从用户所需的过滤器构建动态标头：

  months = (_ePYear - _sPYear) * 12;
  months -= parseInt(_sPMonth);
  months += parseInt(_ePMonth);

  var html = '';
  var counter = 0;

  html = "<thead><tr>";
  html += "<td>Subdomain</td>";

  for(i; i <= months; i++) {
    i %= 13
    if (i == 0) {
      //do nothing
    } else {
      if (i == 1 && counter != 0) {
        _sPYear = parseInt(_sPYear)+1;
      } else {
        _sPYear = _sPYear;
      }

      html += "<td>"+_sPYear+' '+i+"</td>";

      if (counter == months) {
        break;
      }

      counter++;
    }
  }

  html += "</tr></thead>";
  $('#table-mrr-detail').append(html);

之后，我在jquery中构建body来处理结果到表：

  //Build Body
  var html2 = '';
  var counter2 = 0;

  months2 = (_ePYear2 - _sPYear2) * 12;
  months2 -= parseInt(_sPMonth2);
  months2 += parseInt(_ePMonth2);

  html2 += "<tbody>";

  $.each(json.data, function (i, ob) {
      var me = this;
      html2 += "<tr>";
          html2 += "<td>"+this.subdomain+"</td>";
        $.each(ob.data, function (ind, obj) {

          for(i2; i2 <= months2; i2++) {
            i2 %= 13
            if (i2 == 0) {
              //do nothing
            } else {
              if (i2 == 1 && counter2 != 0) {
                _sPYear2 = parseInt(_sPYear2)+1;
              } else {
                _sPYear2 = _sPYear2;
              }
              console.log(this.month+'='+i2);

              if (this.month == i2 && this.year == _sPYear2) {
                html2 += "<td>"+this.amount+"</td>";
              } else {
                html2 += "<td>0</td>";
              }                

              if (counter2 == months2) {
                break;
              }

              counter2++;
            }
          }
        });
      html2 += "</tr>";

  });

  html2 += "</tbody>";
  $('#table-mrr-detail').append(html2);

但是，如果你看看我的json中的回复，那么alim＆＃39;子域名在09，10，11，2017年有价值......

并且......从上面的结果来看，其他子域没有显示任何内容（应该显示基于json和特定头的数据）......

任何帮助都会感激...... 感谢...

修改

这是我的init var：

  var _sDate = $("input#idstartdate").val();
  var _eDate = $("input#idenddate").val();

  var _sPMonth = $("select#periodMonthStart :selected").val();
  var _sPYear = $("select#periodYearStart :selected").val();
  var _ePMonth = $("select#periodMonthEnd :selected").val();
  var _ePYear = $("select#periodYearEnd :selected").val();

  var _sPMonth2 = $("select#periodMonthStart :selected").val();
  var _sPYear2 = $("select#periodYearStart :selected").val();
  var _ePMonth2 = $("select#periodMonthEnd :selected").val();
  var _ePYear2 = $("select#periodYearEnd :selected").val();

  var _subdomain = $("input#subdomain").val();
  var months = 0;
  var months2 = 0;
  var i = parseInt(_sPMonth);
  var i2 = parseInt(_sPMonth);

我从@shivaji编辑了我当前的代码，仍然没有运气

Answer 1

问题在于可变用法。您正在修改实际值，这会使您的逻辑在循环后失败。

我重构了代码以简化它。

工作代码链接：https://jsbin.com/fotezujupu/1/edit?html,js,output

＆＃13;

var json = {"status":"success","data":[{"subdomain":"alim","data":[{"day":15,"month":9,"year":2017,"amount":"35025.97"},{"day":31,"month":10,"year":2017,"amount":"72387.01"},{"day":"01","month":11,"year":2017,"amount":"2335.06"}]},{"subdomain":"ql8","data":[{"day":7,"month":2,"year":2017,"amount":"925827.78"}]},{"subdomain":"Fathani","data":[{"day":27,"month":1,"year":2017,"amount":"231480.00"},{"day":28,"month":2,"year":2017,"amount":"240053.33"},{"day":31,"month":3,"year":2017,"amount":"265773.33"},{"day":30,"month":4,"year":2017,"amount":"257200.00"},{"day":31,"month":5,"year":2017,"amount":"265773.33"},{"day":"03","month":6,"year":2017,"amount":"25720.00"}]},{"subdomain":"asa4","data":[{"day":4,"month":10,"year":2017,"amount":"6010.03"},{"day":30,"month":11,"year":2017,"amount":"45075.21"},{"day":31,"month":12,"year":2017,"amount":"46577.72"},{"day":31,"month":1,"year":2018,"amount":"46577.72"},{"day":28,"month":2,"year":2018,"amount":"42070.19"},{"day":31,"month":3,"year":2018,"amount":"46577.72"},{"day":30,"month":4,"year":2018,"amount":"45075.21"},{"day":31,"month":5,"year":2018,"amount":"46577.72"},{"day":30,"month":6,"year":2018,"amount":"45075.21"},{"day":31,"month":7,"year":2018,"amount":"46577.72"},{"day":31,"month":8,"year":2018,"amount":"46577.72"},{"day":"21","month":9,"year":2018,"amount":"31552.65"}]},{"subdomain":"kenvapes-bpn","data":[{"day":15,"month":4,"year":2017,"amount":"85733.33"},{"day":31,"month":5,"year":2017,"amount":"177182.22"},{"day":30,"month":6,"year":2017,"amount":"171466.67"},{"day":31,"month":7,"year":2017,"amount":"177182.22"},{"day":31,"month":8,"year":2017,"amount":"177182.22"},{"day":"12","month":9,"year":2017,"amount":"68586.67"}]},{"subdomain":"ql7","data":[{"day":12,"month":1,"year":2017,"amount":"2388000.00"}]},{"subdomain":"demo-new","data":[{"day":28,"month":5,"year":2017,"amount":"13861.16"},{"day":30,"month":6,"year":2017,"amount":"14851.24"},{"day":31,"month":7,"year":2017,"amount":"15346.28"},{"day":31,"month":8,"year":2017,"amount":"15346.28"},{"day":30,"month":9,"year":2017,"amount":"14851.24"},{"day":31,"month":10,"year":2017,"amount":"15346.28"},{"day":30,"month":11,"year":2017,"amount":"14851.24"},{"day":"31","month":12,"year":2017,"amount":"15346.28"}]},{"subdomain":"fg32","data":[{"day":15,"month":9,"year":2017,"amount":"5200.00"},{"day":31,"month":10,"year":2017,"amount":"10746.67"},{"day":30,"month":11,"year":2017,"amount":"10400.00"},{"day":31,"month":12,"year":2017,"amount":"10746.67"},{"day":31,"month":1,"year":2018,"amount":"10746.67"},{"day":28,"month":2,"year":2018,"amount":"9706.67"},{"day":31,"month":3,"year":2018,"amount":"10746.67"},{"day":"28","month":4,"year":2018,"amount":"9706.67"}]},{"subdomain":"qol11","data":[{"day":3,"month":2,"year":2017,"amount":"59900.00"},{"day":31,"month":3,"year":2017,"amount":"618966.67"},{"day":30,"month":4,"year":2017,"amount":"599000.00"},{"day":"26","month":5,"year":2017,"amount":"519133.33"}]},{"subdomain":"pyusbyonline10","data":[{"day":27,"month":1,"year":2017,"amount":"113084.56"},{"day":28,"month":2,"year":2017,"amount":"117272.88"},{"day":31,"month":3,"year":2017,"amount":"129837.83"},{"day":30,"month":4,"year":2017,"amount":"125649.51"},{"day":31,"month":5,"year":2017,"amount":"129837.83"},{"day":30,"month":6,"year":2017,"amount":"125649.51"},{"day":31,"month":7,"year":2017,"amount":"129837.83"},{"day":31,"month":8,"year":2017,"amount":"129837.83"},{"day":30,"month":9,"year":2017,"amount":"125649.51"},{"day":31,"month":10,"year":2017,"amount":"129837.83"},{"day":30,"month":11,"year":2017,"amount":"125649.51"},{"day":31,"month":12,"year":2017,"amount":"129837.83"},{"day":31,"month":1,"year":2018,"amount":"129837.83"},{"day":28,"month":2,"year":2018,"amount":"117272.88"},{"day":31,"month":3,"year":2018,"amount":"129837.83"},{"day":30,"month":4,"year":2018,"amount":"125649.51"},{"day":31,"month":5,"year":2018,"amount":"129837.83"},{"day":30,"month":6,"year":2018,"amount":"125649.51"},{"day":31,"month":7,"year":2018,"amount":"129837.83"},{"day":31,"month":8,"year":2018,"amount":"129837.83"},{"day":30,"month":9,"year":2018,"amount":"125649.51"},{"day":31,"month":10,"year":2018,"amount":"129837.83"},{"day":30,"month":11,"year":2018,"amount":"125649.51"},{"day":"24","month":12,"year":2018,"amount":"100519.61"}]},{"subdomain":"oooop","data":[{"day":11,"month":9,"year":2017,"amount":"22335.59"},{"day":"17","month":10,"year":2017,"amount":"34518.64"}]},{"subdomain":"ql15","data":[{"day":9,"month":3,"year":2017,"amount":"17572050.00"}]},{"subdomain":"pyusbyonline12","data":[{"day":21,"month":1,"year":2017,"amount":"52342.50"},{"day":28,"month":2,"year":2017,"amount":"69790.00"},{"day":31,"month":3,"year":2017,"amount":"77267.50"},{"day":30,"month":4,"year":2017,"amount":"74775.00"},{"day":31,"month":5,"year":2017,"amount":"77267.50"},{"day":30,"month":6,"year":2017,"amount":"74775.00"},{"day":31,"month":7,"year":2017,"amount":"77267.50"},{"day":31,"month":8,"year":2017,"amount":"77267.50"},{"day":30,"month":9,"year":2017,"amount":"74775.00"},{"day":31,"month":10,"year":2017,"amount":"77267.50"},{"day":30,"month":11,"year":2017,"amount":"74775.00"},{"day":"05","month":12,"year":2017,"amount":"12462.50"}]},{"subdomain":"r1","data":[{"day":4,"month":1,"year":2017,"amount":"60268.16"},{"day":28,"month":2,"year":2017,"amount":"421877.09"},{"day":31,"month":3,"year":2017,"amount":"467078.21"},{"day":30,"month":4,"year":2017,"amount":"452011.17"},{"day":31,"month":5,"year":2017,"amount":"467078.21"},{"day":"25","month":6,"year":2017,"amount":"376675.98"}]},{"subdomain":"mam","data":[{"day":25,"month":9,"year":2017,"amount":"149833.33"},{"day":"05","month":10,"year":2017,"amount":"29966.67"}]},{"subdomain":"moirea","data":[{"day":29,"month":3,"year":2017,"amount":"497253.33"},{"day":30,"month":4,"year":2017,"amount":"514400.00"},{"day":31,"month":5,"year":2017,"amount":"531546.67"},{"day":30,"month":6,"year":2017,"amount":"514400.00"},{"day":31,"month":7,"year":2017,"amount":"531546.67"},{"day":"29","month":8,"year":2017,"amount":"497253.33"}]},{"subdomain":"pswdevsby14","data":[{"day":4,"month":10,"year":2017,"amount":"5384.27"},{"day":30,"month":11,"year":2017,"amount":"40382.02"},{"day":"24","month":12,"year":2017,"amount":"32305.62"}]},{"subdomain":"ql13","data":[{"day":10,"month":3,"year":2017,"amount":"169716.67"}]},{"subdomain":"dbj2017","data":[{"day":13,"month":1,"year":2017,"amount":"186272.98"},{"day":28,"month":2,"year":2017,"amount":"401203.34"},{"day":31,"month":3,"year":2017,"amount":"444189.42"},{"day":30,"month":4,"year":2017,"amount":"429860.72"},{"day":31,"month":5,"year":2017,"amount":"444189.42"},{"day":30,"month":6,"year":2017,"amount":"429860.72"},{"day":31,"month":7,"year":2017,"amount":"444189.42"},{"day":31,"month":8,"year":2017,"amount":"444189.42"},{"day":30,"month":9,"year":2017,"amount":"429860.72"},{"day":31,"month":10,"year":2017,"amount":"444189.42"},{"day":30,"month":11,"year":2017,"amount":"429860.72"},{"day":"12","month":12,"year":2017,"amount":"171944.29"}]},{"subdomain":"oke","data":[{"day":19,"month":10,"year":2017,"amount":"31350.00"},{"day":"11","month":11,"year":2017,"amount":"18150.00"}]},{"subdomain":"Fg24","data":[{"day":21,"month":3,"year":2017,"amount":"1986157.89"}]},{"subdomain":"ide2sen","data":[{"day":24,"month":1,"year":2017,"amount":"72281.56"},{"day":28,"month":2,"year":2017,"amount":"84328.49"},{"day":31,"month":3,"year":2017,"amount":"93363.69"},{"day":30,"month":4,"year":2017,"amount":"90351.96"},{"day":31,"month":5,"year":2017,"amount":"93363.69"},{"day":"05","month":6,"year":2017,"amount":"15058.66"}]},{"subdomain":"pswdevsby15","data":[{"day":26,"month":11,"year":2017,"amount":"103826.67"},{"day":"04","month":12,"year":2017,"amount":"15973.33"}]},{"subdomain":"ql5","data":[{"day":19,"month":1,"year":2017,"amount":"4907700.00"}]},{"subdomain":"pswdevjkt2","data":[{"day":23,"month":11,"year":2017,"amount":"122513.33"},{"day":"07","month":12,"year":2017,"amount":"37286.67"}]},{"subdomain":"cvabadidjajarukunsejahtera","data":[{"day":17,"month":4,"year":2017,"amount":"86775.56"},{"day":31,"month":5,"year":2017,"amount":"158237.78"},{"day":30,"month":6,"year":2017,"amount":"153133.33"},{"day":31,"month":7,"year":2017,"amount":"158237.78"},{"day":31,"month":8,"year":2017,"amount":"158237.78"},{"day":"10","month":9,"year":2017,"amount":"51044.44"}]},{"subdomain":"ql4","data":[{"day":12,"month":1,"year":2017,"amount":"9419333.32"}]},{"subdomain":"fg31","data":[{"day":28,"month":5,"year":2017,"amount":"56218.99"},{"day":30,"month":6,"year":2017,"amount":"60234.64"},{"day":31,"month":7,"year":2017,"amount":"62242.46"},{"day":31,"month":8,"year":2017,"amount":"62242.46"},{"day":30,"month":9,"year":2017,"amount":"60234.64"},{"day":"29","month":10,"year":2017,"amount":"58226.82"}]},{"subdomain":"PT-SAM","data":[{"day":4,"month":2,"year":2017,"amount":"68586.67"},{"day":31,"month":3,"year":2017,"amount":"531546.67"},{"day":30,"month":4,"year":2017,"amount":"514400.00"},{"day":31,"month":5,"year":2017,"amount":"531546.67"},{"day":30,"month":6,"year":2017,"amount":"514400.00"},{"day":"23","month":7,"year":2017,"amount":"394373.33"}]},{"subdomain":"Redia","data":[{"day":28,"month":1,"year":2017,"amount":"240053.33"},{"day":28,"month":2,"year":2017,"amount":"240053.33"},{"day":31,"month":3,"year":2017,"amount":"265773.33"},{"day":30,"month":4,"year":2017,"amount":"257200.00"},{"day":31,"month":5,"year":2017,"amount":"265773.33"},{"day":"02","month":6,"year":2017,"amount":"17146.67"}]},{"subdomain":"lotusbogalima","data":[{"day":10,"month":3,"year":2017,"amount":"171499.59"},{"day":30,"month":4,"year":2017,"amount":"514498.78"},{"day":31,"month":5,"year":2017,"amount":"531648.74"},{"day":30,"month":6,"year":2017,"amount":"514498.78"},{"day":31,"month":7,"year":2017,"amount":"531648.74"},{"day":"02","month":8,"year":2017,"amount":"34299.92"}]},{"subdomain":"pyusbyonline11","data":[{"day":21,"month":1,"year":2017,"amount":"17900.00"},{"day":28,"month":2,"year":2017,"amount":"23866.67"},{"day":31,"month":3,"year":2017,"amount":"26423.81"},{"day":30,"month":4,"year":2017,"amount":"25571.43"},{"day":31,"month":5,"year":2017,"amount":"26423.81"},{"day":30,"month":6,"year":2017,"amount":"25571.43"},{"day":31,"month":7,"year":2017,"amount":"26423.81"},{"day":31,"month":8,"year":2017,"amount":"26423.81"},{"day":30,"month":9,"year":2017,"amount":"25571.43"},{"day":31,"month":10,"year":2017,"amount":"26423.81"},{"day":30,"month":11,"year":2017,"amount":"25571.43"},{"day":31,"month":12,"year":2017,"amount":"26423.81"},{"day":31,"month":1,"year":2018,"amount":"26423.81"},{"day":28,"month":2,"year":2018,"amount":"23866.67"},{"day":31,"month":3,"year":2018,"amount":"26423.81"},{"day":30,"month":4,"year":2018,"amount":"25571.43"},{"day":31,"month":5,"year":2018,"amount":"26423.81"},{"day":30,"month":6,"year":2018,"amount":"25571.43"},{"day":31,"month":7,"year":2018,"amount":"26423.81"},{"day":31,"month":8,"year":2018,"amount":"26423.81"},{"day":"03","month":9,"year":2018,"amount":"2557.14"}]},{"subdomain":"pswtestsurabaya2","data":[{"day":6,"month":5,"year":2017,"amount":"12183.05"},{"day":"23","month":6,"year":2017,"amount":"46701.69"}]},{"subdomain":"damarsatu","data":[{"day":0,"month":1,"year":2017,"amount":"0.00"},{"day":28,"month":2,"year":2017,"amount":"800177.78"},{"day":31,"month":3,"year":2017,"amount":"885911.11"},{"day":30,"month":4,"year":2017,"amount":"857333.33"},{"day":31,"month":5,"year":2017,"amount":"885911.11"},{"day":"30","month":6,"year":2017,"amount":"857333.33"}]}]};

// Assuming your input fields are strings, so parsing them here itself.
var _sPMonth = parseInt('1');
var _sPYear = parseInt('2017');
var _ePMonth = parseInt('11');
var _ePYear = parseInt('2017');


var noOfMonths = ((_ePYear - _sPYear) * 12) - _sPMonth + _ePMonth + 1;
  
var columns = getColumns();

$('#table-mrr-detail').append(getTableHeaderHtml(columns));

$.each(json.data, function (sdI, subdomainItem) {
  $('#table-mrr-detail').append(getRowHtml(subdomainItem));
});

function getColumns(){
  var columns = [];
  var counter = 0;
  for(var i=0; i < noOfMonths; i++) {
    var column = {};
    column.month = ((_sPMonth + i -1) % 12) + 1;
    column.year = parseInt((_sPMonth + i -1) / 12) + _sPYear;
    columns.push(column);
  }
  return columns;
}

function getTableHeaderHtml(columns){
  var  html = "<thead><tr>";
  html += "<td>Sub domain</td>";
  $.each(columns, function(index, column){
    html += "<td>"+column.year+' '+column.month+"</td>"
  });
  return html;
}

function getRowHtml(subdomainItem){
  var html = "<tr>";
  html += "<td>"+subdomainItem.subdomain+"</td>";
  $.each(columns, function(index, column){
    var obj = findByMonthAndYear(subdomainItem.data, column);
    if (obj) {
      html += "<td>"+obj.amount+"</td>";
    } else {
      html += "<td>0</td>";
    }
  });
  return html;
}

function findByMonthAndYear(data, column){
  for (var i=0; i < data.length; i++) {
        if (data[i].year == column.year && data[i].month == column.month) {
            return data[i];
        }
    }
}

＆＃13;

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://code.jquery.com/jquery.min.js"></script>
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

</head>
<body>

  <table id="table-mrr-detail" class="table"></table>
</body>
</html>

＆＃13;

Jquery在动态表头的特定行上指定结果循环

修改

1 个答案: