Exemple envoi formulaire par GET

exemples/ajax-envoi-formulaire-par-get/contenu.html

@@ -1,6 +1,10 @@
 <h1>AJAX - Envoi formulaire par GET</h1>
 
 <form id="ajax-form-get" method="GET" action="/ajax-form-get">
-    <input type="text" name="name" placeholder="Votre nom ?" />
+    <input type="text" name="name" placeholder="Nom ?" />
+    <input type="text" name="birthdate" placeholder="Date de naissance ?" />
     <input type="submit" class="btn btn-primary" value="Envoyer" />
-</form>
+</form>
+
+<h5>Résultat (HTML) renvoyé par le serveur:</h5>
+<div id="ajax-html"></div>

exemples/ajax-envoi-formulaire-par-get/script.js

@@ -0,0 +1,17 @@
+$('#ajax-form-get').submit(function(e) {
+    e.preventDefault();
+    var form = $(this);
+    var name = form.find('input[name="name"]').val();
+    var birthdate = form.find('input[name="birthdate"]').val();
+    $.ajax({
+        method: 'GET',
+        url: form.prop('action'),
+        data: {
+            name: name, birthdate: birthdate
+        },
+        success: function(data) {
+            $('#ajax-html').html(data);
+        },
+        dataType: 'html'
+    });
+});

server.js

@@ -20,8 +20,12 @@ app.get('/ajax-example', function(req, res) {
   res.send(exampleHtml);
 });
 
+// 2ème exemple : envoi formulaire par méthode GET
 app.get('/ajax-form-get', function(req, res) {
-  var exampleHtml = '<h2>AJAX</h2><p>Un peu de HTML retourné par le serveur.</p>';
+  var name = req.query.name;
+  var birthdate = req.query.birthdate;
+  var exampleHtml = '<p>Salutations, <em>' + name +
+    '</em>, né(e) le <em>' + birthdate + '</em>.</p>';
   res.send(exampleHtml);
 });