jquery - 从远程 JSON 数组返回给定时间段内的放电次数
问题描述
我有一个从日期和到日期的搜索以及一个带有部门的选择框。我希望在给定的时间段内从我的远程 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
解决方案
您可以在 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>