<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Client REST</title>
<script type='text/javascript'>
function lirephrase() {
var url = "http://localhost:8080/liste";
var client = new XMLHttpRequest();
client.open("GET", url, false); // synchrone
client.setRequestHeader("Accept", "application/json");
client.send();
console.log("The request succeeded!\n");
if (client.status == 200) {
console.log("The request succeeded!\n\nThe response representation was:\n\n" + client.responseText);
document.getElementById('phrase').innerHTML = client.responseText;
} else {
console.log("The request did not succeed!\n\nThe response status was: " + client.status + " " + client.statusText + ".");
}
}
function ajouter() {
var monmemo = document.getElementById('ajout').value
var url = "http://localhost:8080/liste";
var client = new XMLHttpRequest();
client.open("POST", url, false); // synchrone
client.setRequestHeader("Content-Type", "application/json");
client.send("{\"item\":\""+monmemo+"\"}");
console.log("The request succeeded!\n");
if (client.status == 200) {
console.log("The request succeeded!\n\nThe response representation was:\n\n" + client.responseText);
document.getElementById('phrase').innerHTML = client.responseText;
} else {
console.log("The request did not succeed!\n\nThe response status was: " + client.status + " " + client.statusText + ".");
}
}
</script>
</head>
<body>
<button onClick="lirephrase()">Lire la phrase du jour</button> <div id="phrase"></div>
<p></p>
<button onClick="ajouter()">Ajouter un mémo à ma liste</button><INPUT id="ajout" TYPE="text" NAME="ajout" VALUE="pain">
<p></p>
<button>Enlever un mémo de ma liste</button><INPUT TYPE="text" NAME="enleve" VALUE="lait">
<p></p>
<button>Lire ma liste de mémos</button><div id="liste"></div>
</body>
</html>