Program ESP8226 WIFI module using Ardunio Environment

Community Jobs and Paid Consultancy
2

For handling multiple pages, one way is to create a single html page which is divided up into a number of logical "pages". The idea is that you expose only one logical page at a time by hiding all others.

I've used such a trick in this project for multiple configuration pages Arduino ESP8266 Speaking Clock see file WebServerHtml.h

In principle, the html page is divided with div tags into logical pages:

<div id=divPage1> 
. . . 
html for page 1 here
. . .
. . .
</div>  <!--  <div id=divPage1>  -->



<div id=divPage2> 
. . . 
html for page 2 here
. . .
. . .
</div>  <!--  <div id=divPage2>  -->



<div id=divPage3> 
. . . 
html for page 3 here
. . .
. . .
</div>  <!--  <div id=divPage3>  -->

to hide a page x:

document.getElementById(page[ x ]).style.display = "none";

to expose a page x:

document.getElementById( page[ x ] ).style.display = "block";

You have to maintain a navigation bar which allows access to the individual "pages".
The use can move between "pages" without a return trip to the server.