ESP-Now sender and receiver are correctly sending and receiving data. I can see that data is coming into receiver and updating main, webserver; just not updating the dashboard, “index_html.”
Used this tutorial for modification of earlier project.
Code: ESP-NOW ESP32_Receiver.ino –dashboard not working
Suspect; problem in adding sensor readings to \”index_html\” web page.
Best Regards,
William
Hi.
Can you open the javascript console on the web browser, refresh the web page and check if there are any logged errors?
Regards,
Sara
Good Morning Sara,
All I see in the java console is “message: ping” and it is incrementing.
Please take a look at this code from index_html page:
“<div class=”card temperature”>
<h4><i class=”fas fa-thermometer-half”></i> BOARD #1 – TEMPERATURE</h4><p><span class=”reading”><span id=”t1″></span> °F</span></p><p class=”packet”>Reading ID: <span id=”rt1″></span></p>
</div>”
Are the values “t1” and “rt1” correct; I do not see where they orginate. Also the “Reading id:” does not display a value.
Data is being received: ESP-Now Sender and Receiver image
Best Regards,
William
Updated 02/05/2022; both ESP32_Sender.ino and ESP32_Receiver.ino, links are still valid.
Only issues remaining are with dashboard; log files and web server (seperate from dashboard) are getting correct data. Dashboard has “repeating” values for temperature and humidity with no value for pressure. Reading Id has no value; always shows “0” for readingid in serial print statement.
Found multiple errors; my apologies.
Regards,
William
Created a video of the issue I am experencing:
Three minute video of issue…
Regards,
William
Hi.
I’m sorry for taking so long to get back to you.
The problem is with your HTML.
The id for a specific HTML element must be unique. You have several elements with the same id “rt1”.
Additionally, you’re setting the same values to some different ids, for example:
document.getElementById("t"+obj.id).innerHTML = obj.temperature.toFixed(2); document.getElementById("i"+obj.id).innerHTML = obj.temperature.toFixed(2);
And this:
document.getElementById("h"+obj.id).innerHTML = obj.humidity.toFixed(2); document.getElementById("d"+obj.id).innerHTML = obj.humidity.toFixed(2);
Add a console.log() after receiving the json variable with the data and check if it is receiving all the data on the page.
var obj = JSON.parse(e.data); –> line 229
console.log(obj);
Then, if that is correct, it means you just probably just have a problem with the ids and the assignment of the values to the elements.
Learn more about ids and assigning values: https://www.w3schools.com/html/html_id.asp
Regards,
Sara
Good Afternoon Sara,
Thank you for catching my mistakes; appreciate the help, after awhile of looking at code, my “old” eyes do not always catch the mistakes. There was a couple of more gottchas; in the message structure –sender was sending “int readingId” and receiver message structure was using “unsigned long int readingId.” Secondly; at some point I had commented out the “struct_message incomingReadings” –“unsigned long int readingId = ncomingReadings.readingId”.
You may mark this resolved.
Best Regards,
William