从远程 JSON 数组返回给定时间段内的放电数

Question

我有一个搜索从日期和到日期，还有一个带有部门的选择框。我希望在给定时间段内从远程 JSON 数组中排出（计数）并显示在 HTML 表中。

这是我的远程 JSON 数组：

{
   "success":true,
   "dataList":[
      {
         "dischargedatetime":"2018-12-26T00:00:00",
         "DepartmentName":"Cardiology",
         "DischargeCount":3
      },
      {
         "dischargedatetime":"2018-12-25T00:00:00",
         "DepartmentName":"Cardiology",
         "DischargeCount":2
      },
      {
         "dischargedatetime":"2018-12-26T00:00:00",
         "DepartmentName":"Clinical Hematology",
         "DischargeCount":3
      }
   ]
}

这是我的网址：

getDepartmentwiseDischarge?startDate=2018-12-25&endDate=2018-12-26&departmentName=Cardiology

Answer 1

您可以在 json 上使用 forEach 循环并绑定到表，如下所示。

var json = [{
  "dischargedatetime": "2018-12-26T00:00:00",
  "DepartmentName": "Cardiology",
  "DischargeCount": 3
}, {
  "dischargedatetime": "2018-12-25T00:00:00",
  "DepartmentName": "Cardiology",
  "DischargeCount": 2
}, {
  "dischargedatetime": "2018-12-26T00:00:00",
  "DepartmentName": "Clinical Hematology",
  "DischargeCount": 3
}];
var DName = [],
  DCount = [];
json.forEach(function(obj) {
  if (DName.indexOf(obj.DepartmentName) == -1)
    DName.push(obj.DepartmentName);
  var lastIndex = DName.length - 1;
  if (typeof DCount[lastIndex] == "undefined")
    DCount.push(obj.DischargeCount);
  else
    DCount[lastIndex] += obj.DischargeCount;
});
Array.prototype.associate = function(keys) {
  var result = {};
  this.forEach(function(el, i) {
    result[keys[i]] = el;
  });
  return result;
};
var datalist = DName.associate(DCount); //Make key value par after sum
var html; //Generate html for table.
$.each(datalist, function(key, val) {
  html += "<tr>"
  html += "<td>" + val + "</td>";
  html += "<td>" + key + "</td > ";
  html += "</tr>"
});
$('table').append(html);

table, th, td {
  border: 1px solid black;
  text-align: center;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <th>DepartmentName</th>
    <th>DischargeCount</th>
  </tr>
</table>