Project Description

 

#1 INTRO

The state of a switch connected to the Arduino / Ethernet shield is shown on a web page that is hosted by the Arduino. AJAX is used to fetch the state of the switch when a button on the web page is clicked.

 

#2 FEATURE

The reason for using a button on the web page to refresh the state of the switch is to keep the code simple for those who are new to AJAX. The next part of this series will automate the reading of the switch using AJAX for a more practical application.

 

#3 WHAT IS AJAX?

AJAX stands for Asynchronous JavaScript and XML.

AJAX is basically the use of a set of JavaScript functions for getting information from the web server (our Arduino). This means that data on a web page can be updated without fetching the whole page each time.

Using AJAX will be an improvement on the previous part of this tutorial as HTML refresh code that makes the page flicker each time it is reloaded is no longer needed. Only the information that has changed (the state of the switch) will be updated on the page eliminating the flicker.

 

#4 HARDWARE

Arduino UNO

Ethernet Shield

Switch ( pin3)

LED

 

#5 OPEN SOURCE

Please refer to the following links.

 

Site : https://startingelectronics.org/

Blog : https://startingelectronics.org/tutorials/arduino/ethernet-shield-web-server-tutorial/web-server-read-switch-using-AJAX/