<!DOCTYPE html>
<html><head>
	<title>Write Example</title>
	<meta charset="UTF-8">
	<!-- CSS styles for HTML content -->
	<style> html, body { width:100%; height: 100%; margin: 0; } </style>
	<!-- NOTE: this example doesn't contain any error handling! -->
	<script language="javascript">
		function doSend() {
			var request = new XMLHttpRequest();
			// handleJson.php is the server-side script that communicates with WebJson and delivers the answer
			request.open("POST", "handleJson.php", true);
			request.setRequestHeader("Content-Type", "application/json");
			request.addEventListener('load', function(event) {
				// this code is executed after an answer arrives
				// TODO: error handling is missing
				var j = JSON.parse(request.responseText);
				var ti = j['data']['Memory.TestInteger'];
				// apply value
				document.getElementById("result").class = '';
				document.getElementById("result").innerHTML = 'Status: ' + ti;
			});
			var val = document.getElementById("TestInteger").value;
			// this is the request: write "Memory.TestInteger"
			// there may be multiple values in the request list
			request.send('{"opcode":"write", "seq":0, "data":{"Memory.TestInteger": ' + val + '}}');
			return false;
		}
	</script>
</head><body>
	<form action="#" onsubmit="return doSend()">
		<table><tr>
			<td><label for="TestInteger">New value for TestInteger</label></td>
			<td><input type="text" name="TestInteger" id="TestInteger"></td>
		</tr><tr>
			<td></td>
			<td><input type="submit" value="Send"></td>
		</tr><tr>
			<td>Result:</td>
			<td id="result"></td>
		</tr></table>
	</form>
</body></html>