close gh-1 Added checkbox for showing/hiding reserved coil/register values

This commit is contained in:
Jarno Rankinen 2023-02-12 14:30:25 +02:00
parent 0baf86c67f
commit f204aeb4ad
2 changed files with 26 additions and 5 deletions

View File

@ -2,15 +2,16 @@
<html lang="en"> <html lang="en">
<head> <head>
<link rel="stylesheet" href="/css/tabledata.css"> <link rel="stylesheet" href="/css/tabledata.css">
<script src="/js/tabledata.js"></script>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title id="title">Enervent Pingvin Kotilämpö</title> <title id="title">Enervent Pingvin Kotilämpö</title>
</head> </head>
<body onload="getData()"> <body onload="getData()">
<table id="data"> <table id="data">
<caption><span id="caption">Holding register values at </span><span id="time"></span></caption> <caption><span id="caption">Holding register values at </span><span id="time"></span><br>
<input type="checkbox" id="incl_res">Include reserved</caption>
<thead><th>Address</th><th>Value</th><th>Symbol</th><th>Description</th></thead> <thead><th>Address</th><th>Value</th><th>Symbol</th><th>Description</th></thead>
<tbody id="datatable"></tbody> <tbody id="datatable"></tbody>
</table> </table>
</body> </body>
</html> </html>
<script src="/js/tabledata.js"></script>

View File

@ -30,7 +30,9 @@ function coils(data) {
td.appendChild(value) td.appendChild(value)
tablerow.appendChild(td) tablerow.appendChild(td)
} }
if (data[n].reserved) {
tablerow.className = "reserved"
}
datatable.appendChild(tablerow) datatable.appendChild(tablerow)
} }
} else { } else {
@ -61,7 +63,9 @@ function registers(data) {
td.appendChild(value) td.appendChild(value)
tablerow.appendChild(td) tablerow.appendChild(td)
} }
if (data[n].reserved) {
tablerow.className = "reserved"
}
datatable.appendChild(tablerow) datatable.appendChild(tablerow)
} }
console.log(`${timeStamp()} Done.`) console.log(`${timeStamp()} Done.`)
@ -120,3 +124,19 @@ function getData() {
// There's no need to update exactly every 5 seconds, the skew is fine // There's no need to update exactly every 5 seconds, the skew is fine
setTimeout(getData, 5*1000); setTimeout(getData, 5*1000);
} }
// Show or hide rows for "reserved" values when clicking the checkbox
incl_res = document.getElementById("incl_res")
incl_res.addEventListener("change", (event) => {
reservedRows = document.getElementsByClassName("reserved")
if (event.currentTarget.checked) {
for (i=0; i<reservedRows.length; i++) {
reservedRows[i].hidden = true
}
} else {
for (i=0; i<reservedRows.length; i++) {
reservedRows[i].hidden = false
}
}
});