Add links to a column
by Sascha
HTML
<table id="senate-data">
</table>
CSS
body {
background: white;
padding: 20px;
font-family: Helvetica;
}
table td {
border: 1px solid black;
}
JavaScript
var data = {
"status": "OK",
"copyright": " Copyright (c) 2019 Pro Publica Inc. All Rights Reserved.",
"results": [{
"congress": "113",
"chamber": "Senate",
"num_results": 105,
"offset": 0,
"members": [{
"id": "A000360",
"title": "Senator, 2nd Class",
"first_name": "Lamar",
"party": "R",
"twitter_account": "SenLamar",
"seniority": "11",
"phone": null,
"fax": null,
"url": "https://www.lamar.senate.gov/public",
"state": "TN",
},
{
"id": "A000368",
"title": "Senator, 3rd Class",
"first_name": "Kelly",
"party": "R",
"twitter_account": "SenAlexander",
"seniority": "11",
"phone": null,
"fax": null,
"url": "https://www.alexander.senate.gov/public",
"state": "TN",
}
]
}]
};
function createTableWithLink(tbody, data, field, urlInfo) {
var texto;
for (var i = 0; i < data.length; i++) {
var row = document.createElement("tr");
tbody.appendChild(row);
for (var j = 0; j < field.length; j++) {
var cell = document.createElement("td");
console.log(field[j], urlInfo.linkField);
if (field[j] === urlInfo.linkField) {
cell.innerHTML = '<a href="' + data[i][urlInfo.urlField] + '" target="_blank">' +
data[i][field[j]] + '</a>';
} else {
cell.innerHTML = data[i][field[j]];
}
row.appendChild(cell);
}
}
}
createTableWithLink(
document.getElementById("senate-data"), data.results[0].members, ["first_name", "party", "state", "seniority", "twitter_account"], {
linkField: "first_name",
urlField: "url"
}
);