I have this awesome script which converts a horrible JSON Report from an Application API endpoint which was written by a member of StackExchange (JSON (from HTML Table) to CSV). It runs perfectly in the Run Snippet but, I want to put this into an HTML page instead.
I have tried adding a header:
<!DOCTYPE html>
<html>
<head>
<title>Convert JSON Report to Table</title>
</head>
<body>
<script type="text/javascript">
and resolved the scripts, body and html at the bottom but it doesn't do anything.
Below is the script I want to run in HTML. How would I put this into a blank HTML page? Thanks, Matt
var data = {
"Header": {
"Time": "2016-03-30T16:10:19-07:00",
"ReportName": "GeneralLedger",
"ReportBasis": "Accrual",
"StartPeriod": "2016-01-01",
"EndPeriod": "2016-03-31",
"Currency": "GBP",
"Option": [{
"Name": "NoReportData",
"Value": "false"
}]
},
"Columns": {
"Column": [{
"ColTitle": "Date",
"ColType": "tx_date"
}, {
"ColTitle": "Transaction Type",
"ColType": "txn_type"
}, {
"ColTitle": "No.",
"ColType": "doc_num"
}, {
"ColTitle": "Name",
"ColType": "name"
}, {
"ColTitle": "Memo/Description",
"ColType": "memo"
}, {
"ColTitle": "Split",
"ColType": "split_acc"
}, {
"ColTitle": "Amount",
"ColType": "subt_nat_amount"
}, {
"ColTitle": "Balance",
"ColType": "rbal_nat_amount"
}]
},
"Rows": {
"Row": [{
"Header": {
"ColData": [{
"value": "Current",
"id": "144"
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}, {
"value": ""
}]
},
"Rows": {
"Row": [{
"ColData": [{
"value": "2016-03-16"
}, {
"value": "Bill Payment (Cheque)",
"id": "181"
}, {
"value": "1"
}, {
"value": "Teddy's T Shirt Supplier",
"id": "70"
}, {
"value": "104478"
}, {
"value": "Creditors",
"id": "138"
}, {
"value": "-600.0"
}, {
"value": "-600.0"
}],
"type": "Data"
}, {
"ColData": [{
"value": "2016-03-17"
}, {
"value": "Bill Payment (Cheque)",
"id": "184"
}, {
"value": "2"
}, {
"value": "Teddy's T Shirt Supplier",
"id": "70"
}, {
"value": "104478"
}, {
"value": "Creditors",
"id": "138"
}, {
"value": "-120.0"
}, {
"value": "-720.0"
}],
"type": "Data"
}, {
"ColData": [{
"value": "2016-03-17"
}, {
"value": "Deposit",
"id": "180"
}, {
"value": ""
}, {
"value": "",
"id": ""
}, {
"value": "Opening Balance"
}, {
"value": "Opening Balance Equity",
"id": "137"
}, {
"value": "2400.0"
}, {
"value": "1680.0"
}],
"type": "Data"
}, {
"ColData": [{
"value": "2016-03-23"
}, {
"value": "Payment",
"id": "186"
}, {
"value": "345678"
}, {
"value": "Maxamillion Enterprises",
"id": "68"
}, {
"value": ""
}, {
"value": "Debtors",
"id": "140"
}, {
"value": "216.0"
}, {
"value": "1896.0"
}],
"type": "Data"
}]
}
}]
}
};
function parse(data) {
var rows = [],
row, curRow, rowSegment;
for (var i = 0; i < data.Rows.Row.length; ++i) {
rowSegment = data.Rows.Row[i].Rows.Row;
for (var j = 0; j < rowSegment.length; ++j) {
row = [];
curRow = rowSegment[j].ColData;
for (var x = 0; x < curRow.length; ++x) {
row.push(curRow[x].value);
}
rows.push(row);
}
}
return rows;
}
var parsed = parse(data);
var rowEl, outEl = document.getElementById('html-out'),
val;
for (var i = 0; i < parsed.length; ++i) {
rowEl = document.createElement("div");
rowEl.setAttribute("class", "row");
rowEl.appendChild(document.createTextNode(parsed[i].join(', ')));
outEl.appendChild(rowEl);
}
