Exemple Client HTML jQuery

Création de la page HTML dynamique du client avec jQuery

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>Client REST</title>
<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script type='text/javascript'>

var url = "http://localhost:8080/liste";

function lireliste() { 
  $.get(url, function(data) {
    $('#liste').html(data);
    console.log('la liste est chargée.');
  });
}

function ajouter() {
  var itemajouter = $("#ajout").val();
  var sendInfo = { "item": itemajouter};
  $.post(url, sendInfo);
  console.log("l'item a été ajouté à la liste.");
}

function enlever() {
  var itemajouter = $("#suppression").val();
  var sendInfo = { "item": itemajouter};
  $.ajax(
    {
      type: "DELETE",
      url: url,
      data: sendInfo
    }
  );
  console.log("l'item a été supprimé à la liste.");
}

</script>

</head>

<body>
<button onClick="ajouter()">Ajouter un mémo à ma liste</button><INPUT id="ajout" TYPE="text" NAME="ajout" VALUE="pain">
<div id="ajouteritem"></div>
<p></p>
<button onClick="enlever()">Enlever un mémo de ma liste</button><INPUT id="suppression" TYPE="text" NAME="enleve" VALUE="lait">
<div id="enleveritem"></div>
<p></p>
<button onClick="lireliste()">Lire ma liste de mémos</button><div id="liste"></div>

</body>
</html>