1
0
Fork 0
Du kannst nicht mehr als 25 Themen auswählen Themen müssen entweder mit einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

58 Zeilen
2.3 KiB
HTML

vor 3 Jahren
<html>
<head>
<title>Income client</title>
</head>
<body>
<p>Please share your income for comparison!!</p>
<table id="all-incomes"><tr><td>Placeholder</td></tr></table>
Average: <input id="avg" readonly>
<br><br><br>
<div>
Description: <input id="description" value=""><br>
Amount: <input id="amount" value=""><br>
<button onclick="add_income()">Add Income</button>
</div>
<script>
function all_incomes() {
const xhttp = new XMLHttpRequest();
document.getElementById("all-incomes").innerHTML = "<tr><th>Description</th><th>Amount</th></tr>";
xhttp.onload = function() {
for (let job of JSON.parse(this.responseText)) {
if (job === null) {
continue;
}
document.getElementById("all-incomes").innerHTML += `<tr><td>${job["description"]}</td><td>${job["amount"]}</td></tr>`;
}
}
xhttp.open("GET", "/incomes", true);
xhttp.send();
const xhttp2 = new XMLHttpRequest();
xhttp2.onload = function() {
document.getElementById("avg").value = this.responseText;
}
xhttp2.open("GET", "/incomes/average", true);
xhttp2.send();
}
function add_income() {
const xhttp3 = new XMLHttpRequest();
xhttp3.onload = function() {
all_incomes();
document.getElementById("description").value = "";
document.getElementById("amount").value = "";
}
xhttp3.open("POST", "/income", true);
let job = {
description: `${document.getElementById("description").value}`,
amount: `${document.getElementById("amount").value}`
}
xhttp3.setRequestHeader("x-api-key", "secretp4ssw0rd");
xhttp3.setRequestHeader("Content-type", "application/json");
xhttp3.send(JSON.stringify(job));
}
all_incomes();
</script>
</body>
</html>