Hi Brian.
Did you try opening a file with all your HTML page on your browser, just to check if everything is working as expected with the page?
Are you uploading the file to the ESP32 SPIFFS? Did you change the file name? 
Double-check if you’re not missing any closing tags.
 
Regards.
Sara

Hey Sara,
Thanks for the response 😉
I developed the HTML and tested the page in the browser before adding it to my ESP32 project and ran it through the W3C HTML validator and everything was peachy.
No filenames were changed when uploading using the upload tool.
I’ve tried with both inline CSS as well as a link rel to the style.css both with similar results.
Thanks for your help
Kind Regard, BrianO

Hi again.
That’s weird.
Are you using placeholders  and the processor() function on your HTML?
Regards,
Sara

Thanks Sara,
No, at this stage, the HTML is being served directly, without processing. I tend to work in a “building block” fashion, at this stage, I am using a HTML file with a fair chunk of JavaScript (approx. 22KB) and a style.css file (2KB) reading directly from the SPIFFS /http folder.
The HTML when loaded from the PC into the browser works just fine, and all of the JavaScript works in place too (input type radio and checkbox with onchange event writes into a multi-dimensional array and then writes back to the page using document.getElementById(“field name”).innerHTML = value).
I haven’t got to the stage where the HTML interacts with the sketch and visa-versa.
Kind Regards
BrianO

Hi again.
What lines of code are you using to serve the web page when you access the ESP IP address?

Hey Sara,
This was lifted directly from the AsyncESP32WebServer.ino sketch:
// Route for root / web page
server.on(“/”, HTTP_GET, [](AsyncWebServerRequest *request){
request->send(SPIFFS, “/index.html”, String(), false, processor);
});
I am going to try to pull the index.html apart to try to identify exactly where it is falling over. I know, that’s probably something that I should have tried when I saw the odd behaviour originally 🙂 First, I’ll try the html without the CSS, then without the JavaScript and then with smaller parts of the nested tables.
I’ll let you know how I get on 😉 unless you see any other problems or have any other suggestions in the meantime.
Thanks for your help!
Kind Regards
BrianO

Okay, so I’ve made some progress. It seems that there WAS an issue in the HTML document, the link to the Google fonts directive was incorrect. I’ve removed it and now I have been able to progress.
Now to try to get on with the rest of the coding 🙂
Thanks for your help Sara.
Kind Regards
BrianO

Great.
I just want to mention that since you’re not using placeholders on the HTML, you don’t need to use the processor function:

server.on(“/”, HTTP_GET, [](AsyncWebServerRequest *request){
  request->send(SPIFFS, “/index.html”, String(), false, processor);
});

Instead, serve the web page as follows:

server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
  request->send(SPIFFS, "/index.html", "text/html");
});

Regards,
Sara

Thanks Sara,
I will be using placeholders on the HTML when I am doing some actual processing. Thanks for pointing that out, though 🙂
Kind Regards
BrianO