Hello, i am using Arduino Wifi rev 2 with the DHT11 sensor!
The whole idea is to show a web page when someone is connected in the arduino wifi and control a fan and get temperature and humidity sensor values.
Everything is working fine except one thing, i have made a form in which i have an input of type rage and i want via that form to control a value named fanthreshold on the Arduino.
I have been trying for a while now with no luck on how to get the value from the form request.
here is the code i have
#include <WiFiNINA.h>
#include <dht.h>
#include <SPI.h>
#include <SD.h>
dht DHT; // creates a DHT object
int sensor = A2;
int fan = 3;
boolean fanstatus = false;
boolean manual = true;
int fanthreshold = 25;
int card = 4;
char ssid[] = "Ptixiaki"; // network SSID (name)
int status = WL_IDLE_STATUS;
WiFiServer server(80);
String header;
void setup() {
Serial.begin(9600);
pinMode(fan, OUTPUT);
if (!SD.begin(card)) {
Serial.println("Card failed, or not present");
}
else {
Serial.println("card initialized.");
}
status = WiFi.beginAP(ssid);
if (status != WL_AP_LISTENING) {
Serial.println("Creating access point failed");
while (true);
}
delay(1000);
server.begin();
}
void saveSensorData()
{
int chk = DHT.read11(sensor); // Starts reading from the DHT11 sensor
float t = DHT.temperature; // Gets the values of the temperature
float h = DHT.humidity; // Gets the values of the humidity
File dataFile = SD.open("data.txt", FILE_WRITE);
if (dataFile) {
dataFile.println("Temperature: ");
dataFile.print(t);
dataFile.println("");
dataFile.println("Humidity: ");
dataFile.print(h);
dataFile.println("");
dataFile.close();
} else {
Serial.println("There was an error with the sd card.");
}
}
void loop()
{
WiFiClient client = server.available();
// saveSensorData();
// Serial.println("Sensor Data was written on the card");
// delay(2000);
if (client) { // if you get a client,
Serial.println("new client"); // print a message out the serial port
String currentLine = ""; // make a String to hold incoming data from the client
while (client.connected()) { // loop while the client's connected
if (client.available()) { // if there's bytes to read from the client,
char c = client.read(); // read a byte, then
header += c; // print it out the serial monitor
if (c == '\n') { // if the byte is a newline character
if (currentLine.length() == 0) {
client.println("HTTP/1.1 200 OK");
client.println("Content-type:text/html");
client.println("Connection: close");
client.println();
// Display the HTML web page
client.println("<!DOCTYPE html><html>");
client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">");
client.println("<meta HTTP-EQUIV=\"refresh\" content=\"4\">");
client.println("<link rel=\"icon\" href=\"data:,\">");
client.println("<style>html,body { font-family: Arial; margin: 0px; padding:0px; background-color: #e2e4e7;}");
client.println(".button { background-color: #00b1b3; border: none; color: white; padding: 5px 15px;");
client.println("text-decoration: none; font-size: 16px; margin: 2px; cursor: pointer;border-radius:10px;}");
client.println(".none { pointer-events: none; opacity: 0.5;}");
client.println("</style></head>");
client.println("<body><div style=\"text-align:center;background-color:#fff; padding:30px 20px;font-size: 20px;\">Temp and Humidity Readings</div>");
int chkData = DHT.read11(sensor); // Starts reading from the DHT11 sensor
float t = DHT.temperature; // Gets the values of the temperature
float h = DHT.humidity; // Gets the values of the humidity
client.println("<h4 id=\"temp\" style=\"text-align:center;\">Temperature: ");
client.print(t, 1);
client.println("</h4>");
client.println("<h4 id=\"hum\" style=\"text-align:center;\">Humidity: ");
client.print(h, 0);
client.println("</h4>");
client.println("<h5>New Reading in: <span id=\"timer\">4</span></h5>");
client.println("<h5>Fan Threshold: ");
client.print(fanthreshold);
client.println("</h5>");
// ========================== Manual - Auto ===========================================
client.println("<div style=\"text-align:center; margin-bottom: 30px;\">");
if (manual == true) {
client.println("<a href=\"/Manual\"\"><button class=\"button none\">Manual</button></a>");
} else {
client.println("<a href=\"/Manual\"\"><button class=\"button\">Manual</button></a>");
}
if (manual == false) {
client.println("<a href=\"/Auto\"\"><button class=\"button none\">Auto</button></a>");
} else {
client.println("<a href=\"/Auto\"\"><button class=\"button\">Auto</button></a>");
}
client.println("</div>");
// ========================== Manual - FORM ===========================================
if (manual == true) {
client.println("<div style=\"background-color: #fff; padding:10px;\">");
} else {
client.println("<div class=\"none\" style=\"background-color: #fff; padding:10px;\">");
}
client.println("<div style=\"text-align:right;\">");
if (fanstatus == true) {
client.println("<a href=\"/ON\"\"><button class=\"button none\">Start Fan</button></a>");
} else {
client.println("<a href=\"/ON\"\"><button class=\"button\">Start Fan</button></a>");
}
if (fanstatus == false) {
client.println("<a href=\"/OFF\"\"><button class=\"button none\">Stop Fan</button></a>");
} else {
client.println("<a href=\"/OFF\"\"><button class=\"button\">Stop Fan</button></a>");
}
client.println("</div>");
//========================== FORM ===========================================
client.println("<form action=\"/\" method=\"POST\"");
client.println("<h3>Temp");
client.println("<output name=\"tempOutputName\" id=\"tempOutputId\">24</output>");
client.println("</h3>");
client.println("<input type=\"range\" min=\"20\" max=\"35\" name=\"tempInputName\" id=\"tempInputId\" value=\"24\" style=\"width:100%\" oninput=\"tempOutputId.value = tempInputId.value\">");
client.println("<button class=\"button\" type=\"submit\">Submit</button>");
client.println("</form>");
client.println("</div>");
//========================== JS Scripts ======================================
client.println("<script>");
client.println("var counter = 4;setInterval(function(){counter--;document.getElementById('timer').innerHTML = counter;},1000);");
client.println("</script");
client.println("</body></html>");
client.println();
// break out of the while loop:
break;
}
else {
currentLine = "";
}
}
else if (c != '\r') {
currentLine += c;
}
if (currentLine.endsWith("GET /ON"))
{
digitalWrite(fan, HIGH);
fanstatus = true;
}
if (currentLine.endsWith("GET /OFF"))
{
digitalWrite(fan, LOW);
fanstatus = false;
}
if (currentLine.endsWith("GET /Manual"))
{
manual = true;
}
if (currentLine.endsWith("GET /Auto"))
{
manual = false;
}
}
}
// close the connection:
client.stop();
}
}
Looking for someone that can help me out on how to get the value of the input field