ESP32 - Html link
Posted: Thu Jan 23, 2020 10:16 pm
Hello Community I am programming an ESP32 module and I have a code that generates an access point and displays an html with two buttons that change the state of three LEDs. I want to insert a button that calls a second html code that is inside (void one ()) and on this page has the following text (This page links the engine). Detail: the page that is already being displayed in the browser must be updated by the new html code of the second html page called by the button. How can I change my code to obtain this third button?
Sorry for the simple question, it is not laziness, but really I tried everything and I was unable to click the button and call the function and display the page in the browser.
Code: Select all
#include <WiFi.h>
#include <WebServer.h>
const char* ssid = "ssid";
const char* password = "password";
WiFiServer server(80);
String header;
String output26State = "off";
String output27State = "off";
const int output26 = 26;
const int output27 = 27;
void setup()
{
Serial.begin(115200);
pinMode(output26, OUTPUT);
pinMode(output27, OUTPUT);
digitalWrite(output26, LOW);
digitalWrite(output27, LOW);
WiFi.softAP(ssid, password);
delay(10);
IPAddress IP = WiFi.softAPIP();
Serial.print("IP Address: ");
Serial.println(IP);
server.begin();
}
void one()
{
WiFiClient client = server.available();
client.println("<h1>This page turns on the engine</h1>"); //<<------------------- Show that html page
client.println();
}
void loop()
{
WiFiClient client = server.available(); // Listen for incoming clients
if (client)
{ // If a new client connects,
Serial.println("New Client."); // print a message out in 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
Serial.write(c); // print it out the serial monitor
header += c;
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("<!DOCTYPE html><html>");
client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">");
client.println("<link rel=\"icon\" href=\"data:,\">");
client.println("<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}");
client.println(".button { background-color: #4CAF50; border: none; color: white; padding: 16px 40px;");
client.println("text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}");
client.println(".button2 {background-color: #555555;}</style></head>");
client.println("<body>");
client.println();
if (header.indexOf("GET /one") >= 0)
{
Serial.println("Page One");
output26State = "on";
digitalWrite(output26, HIGH);
one();
}
break;
}
else // if you got a newline, then clear currentLine
{
currentLine = "";
}
}
else if (c != '\r') // if you got anything else but a carriage return character,
{
currentLine += c; // add it to the end of the currentLine
}
}
}
header = "";
client.stop();
Serial.println("Client OFF.");
}
}