根据HTML表的ID jQuery/javaScript对数据进行排序
Sorting data to the HTML tables by their ID jQuery/javaScript
我有一个迭代问题,几天来我一直在努力解决它。
我有一个jQuery脚本,它从url中获取JSON对象,然后将其放入数组中。当我有3个不同的表,并且脚本将数据放入其中的3个表时,就会出现问题。我试图通过#id识别对其进行排序,但根本不起作用。
这是一个从服务器获取数据的脚本。JSON对象为:[{"Date": 20160721, "Failures": 5, "Hostname": "AIX", "Scan policy": "compliance-rhel6-int-prd"}, {"Date": 20160721, "Failures": 1, "Hostname": "Linux", "Scan policy": "compliance-rhel6-int-prd"}]
脚本:
<script>
var url = 'http://jsonobj/_server_data'
$.getJSON(url,
function (data) {
var tr;
for (var i = 0; i < data.length; i++) {
tr = $('<tr/>');
tr.append("<td>" + data[i].Date + "</td>");
tr.append("<td>" + data[i].Failures + "</td>");
tr.append("<td>" + data[i].Hostname + "</td>");
$('table').append(tr);
}
});
</script>
我要做的是创建两个表——一个用于AIX,一个用于Linux,并仅存储该系统的数据。现在,相同的数据出现在两个表中。我试图通过将$.(#hostname)
作为ID进行排序,但没有成功。
谢谢你的帮助!
页面上只有两个表。一个id为#AIX
,另一个id是#Linux
HTML:
<table id="AIX"></table>
<table id="Linux"></table>
Javascript:
<script>
var url = 'http://jsonobj/_server_data'
$.getJSON(url,
function (data) {
var tr;
for (var i = 0; i < data.length; i++) {
tr = $('<tr/>');
tr.append("<td>" + data[i].Date + "</td>");
tr.append("<td>" + data[i].Failures + "</td>");
tr.append("<td>" + data[i].Hostname + "</td>");
// This is where the magic happens
$('table#' + data[i].Hostname).append(tr);
}
});
</script>
这样,tr
元素将仅附加到与主机名ID匹配的表中。
这应该可以做到:
var AIX = [], Linux = [];
var url = "http://jsonobj/_server_data";
$.getJSON(url, function(data) {
data = JSON.parse(data);
for(var x in data) {
if(data[x].Hostname == "AIX") {
AIX[AIX.length] = data[x];
} else if(data[x].Hostname == "Linux") {
Linux[Linux.length] = data[x];
}
}
printTables();
});
function printTables() {
var tableAIX = document.getElementById('tableAIX');
var newAIX = "";
var tableLinux = document.getElementById('tableLinux');
var newLinux = "";
for(var x in AIX) {
newAIX += "<tr><td>"+AIX[x].Date+"</td><td>"+AIX[x].Failures+"</td><td>"+AIX[x].Hostname+"</td></tr>";
}
for(var x in Linux) {
newLinux += "<tr><td>"+Linux[x].Date+"</td><td>"+Linux[x].Failures+"</td><td>"+Linux[x].Hostname+"</td></tr>";
}
tableAIX.innerHTML = newAIX;
tableLinux.innerHTML = newLinux;
}
以此作为HTML:
<table id='tableAIX'></table>
<table id='tableLinux'></table>
Simple:迭代表。
$.getJSON(url, function (data) {
var tr;
for (var i = 0, $tables = $('table'), c; c = data[i]; i++) {
$tr = $('<tr/>');
$tr.append("<td>" + c.Date + "</td>");
$tr.append("<td>" + c.Failures + "</td>");
$tr.append("<td>" + c.Hostname + "</td>");
$tables[i].appendChild($tr[0]);
}
});
相关文章:
- 对角度数据表中括号内的数字进行排序
- 对损坏的子行进行排序的数据表
- 数据表排序但对行进行分组
- 角度未排序数据
- 数据表通过分析一列的值对其进行排序
- 排序数据表
- 对d3堆叠条形图的数据进行排序
- 如何对JQuery Handlebar生成的数据进行排序
- 数组数据排序类似mysql查询
- 使用JQuery对子表数据排序
- 数据排序应该在客户端还是服务器上完成
- a不同列列表的未定义或空引用的数据排序错误
- 日历数据排序 json 树
- 如何在ng-repeat中使用嵌套对象将数据排序为angular js中的JSON数据
- 使用knockout.js与json数据排序列表
- 如何突出显示页面上数据排序类型的菜单项
- dojox.grid.EnhancedGrid中的数据排序
- 在循环值时对JSON数据排序
- 帮助将DIV中的属性数据排序捕获为数组?Jquery/Javascript
- 如何从属性创建数组'数据排序'使用显示的所有分区的Jquery