AJAX for dynamic image source on webserver? Possible or no?

Hi everyone,

I'm working on a project that uses AJAX to display force data from accelerometers on a webpage (hosted on the webserver of an Arduino UNO ethernet shield) whenever a certain force threshold is breached. The numerical data is showing nicely. However, I'd also like there to be a visual aspect to this project. The accelerometers are being used in a concussion sensing application, so I'd like to be able to upload different images showing the impact zone on the head depending on the force data that has been received (see attached files for examples).

I was wondering if I could just send multiple GET requests from my Javascript within one functioon? I have an indexV2.htm which just has var request = new XMLHttpRequest(); which works fine. dataRequest and imageRequest are my proposed requests in indexV3.txt(attached)

For example GET/ajax_switch for force data on dataRequest, and then GET/headImage for imageRequest for the pictures? If can do this, how should the body onload block be adjusted?

If not, how can I go about getting these images showing on my webpage?

Thanks,
Chris

hitFrontLeftTop.jpg

indexV3.txt (2.98 KB)

WebServerAJAXApril8.ino (9.33 KB)