Jump to content

bms_007

Members
 View Profile  See their activity

  • Posts

    4

  • Joined

  • Last visited

bms_007's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. bms_007
    Now I add this to change cell colours dependent on cell value:- <table id="c2-info"; class="cust2";> <br /> <th>Relays Alarm Errors</th> <th>State</th> <tbody> <tr><td>Relay 1</td> <td><b><span id="val0">...</b></span> </td></tr> <tr><td>Relay 2</td> <td><b><span id="val1">...</b></span> </td></tr> <tr><td>Alarm</td> <td><b><span id="val2">...</b></span> </td></tr> <tr><td>Error</td> <td><b><span id="val3">...</b></span> </td></tr></tbody> </table> <script> var t = document.getElementById('c2-info'); if(t) { Array.from(t.rows).forEach((td, rowIdx) => { Array.from(td.cells).forEach((cell, cellIdx) => { if (cell.innerText == '') { cell.style.backgroundColor = 'Tomato'; }else if (cell.innerText == 'CLOSED') { cell.style.backgroundColor = 'Tomato'; }else if (cell.innerText == 'ALARM') { cell.style.backgroundColor = 'Red'; }else if (cell.innerText == 'Error') { cell.style.backgroundColor = 'MediumSeaGreen'; }else if (cell.innerText == 'Error 1') { cell.style.backgroundColor = 'Green'; } }); }); } </script It will pick out all <tr><td>Error</td> in this part and behave as expected. but ignores these <td><b><span id="val3">...</b></span> </td></tr> Why? what am I missing? BTW it also picks out the <...> but not the id="val3"!
  2. bms_007
    Okay so I will attempt to publish everything here. code on SD card :- <html> <head> <script> function GetArduinoInputs() { nocache = "&nocache=" + Math.random() * 1000000; var request = new XMLHttpRequest(); request.onreadystatechange = function() { if (this.readyState == 4) { if (this.status == 200) { if (this.responseXML != null) { document.getElementById("val0").innerHTML = this.responseXML.getElementsByTagName('analog')[0].childNodes[0].nodeValue; document.getElementById("val1").innerHTML = this.responseXML.getElementsByTagName('analog')[1].childNodes[0].nodeValue; document.getElementById("val2").innerHTML = this.responseXML.getElementsByTagName('analog')[2].childNodes[0].nodeValue; document.getElementById("val3").innerHTML = this.responseXML.getElementsByTagName('analog')[3].childNodes[0].nodeValue; } } } } request.open("GET", "ajax_inputs" + nocache, true); request.send(null); setTimeout('GetArduinoInputs()', 400); } </script> <style type="text/css"> .cust2 { font-family: Arial, Helvetica, sans-serif; border-collapse: collapse; width: 500px;} .cust2 td, .cust2 th { border: 1px solid #ddd; padding: 5px;} .cust2 tr:nth-child(even){background-color: #f2f2f2;} .cust2 th { padding-top: 9px; padding-bottom: 9px; text-align: left; background-color: LightSalmon; color: white;} </style> </head> <body onload="GetArduinoInputs()"> <table class="cust2"> <br /> <th>Relays Alarm Errors</th> <th>State</th> <tr><td>Relay 1</td> <td><b><span id="val0">...</b></span> </td></tr> <tr><td>Relay 2</td> <td><b><span id="val1">...</b></span> </td></tr> <tr><td>Alarm</td> <td><b><span id="val2">...</b></span> </td></tr> <tr><td>Error</td> <td><b><span id="val3">...</b></span> </td></tr> </table>
  3. bms_007
    So It Seems that any data displayed in the table using this method : <tr><td>Error</td> <td><b><span id="val3">...</b></span> ie using id="val3" is ignored using this script:- <script> var t = document.getElementById('c2-info'); if(t) { Array.from(t.rows).forEach((td, rowIdx) => { Array.from(td.cells).forEach((cell, cellIdx) => { if (cell.innerText == '') { cell.style.backgroundColor = 'Tomato'; }else if (cell.innerText == 'CLOSED') { cell.style.backgroundColor = 'Tomato'; }else if (cell.innerText == 'ALARM') { cell.style.backgroundColor = 'Red'; }else if (cell.innerText == 'Error') { cell.style.backgroundColor = 'MediumSeaGreen'; }else if (cell.innerText == 'Error 1') { cell.style.backgroundColor = 'Green'; } }); }); } </script whilst it displays the correct text. WHY?
  4. bms_007 started following Dynamic Cell colour change dependent on table cell value
  5. bms_007
    Hi all, I'm hoping that someone here can help me. I am attempting to dynamically change cell colours depending on call content. Please see post here:https://forum.arduino.cc/t/html-dynamic-cell-colour-change-dependent-on-table-cell-value/1123814/3 as all code and steps taken are clearly documented. I'm no HTML expert and have no idea what's wrong! Any help would be very much appreciated. Thanks in advance.
×
×
  • Create New...