-[A.4. Appeler une API REST/JSON en GET](#a4-appeler-une-api-restjson-en-get)
-[Étape suivante](#Étape-suivante)
***Ce TP va permettre de connecter notre appli JS à une base de données distante par l'intermédiaire d'une API REST/JSON mettre en oeuvre les principales méthodes de sélection et de modification d'éléments de l'arbre DOM.***
***Ce TP va permettre de connecter notre appli JS à une base de données distante par l'intermédiaire d'une API REST/JSON.***
## A.1. Installation
## A.1. Configuration du projet
...
...
@@ -186,4 +186,4 @@ Comme on peut le voir, **aucune version d'Internet Explorer n'est compatible ave
## Étape suivante
Maintenant que l'on est capable de faire communiquer notre appli JS avec un serveur distant, nous allons voir dans le prochain exercice comment simplifier notre code à l'aide de jQuery : [B. jQuery](./B-jquery.md).)
\ No newline at end of file
Maintenant que l'on est capable de faire communiquer notre appli JS avec un serveur distant, nous allons voir dans le prochain exercice comment simplifier notre code à l'aide de jQuery : [B. jQuery](./B-jquery.md).
-[B.4. les événements avec jQuery](#b4-les-événements-avec-jquery)
-[Étape suivante](#Étape-suivante)
***Ce TP va permettre de connecter notre appli JS à une base de données distante par l'intermédiaire d'une API REST/JSON mettre en oeuvre les principales méthodes de sélection et de modification d'éléments de l'arbre DOM.***
***jQuery doit permettre de simplifier notre code, voyons dans cette partie du TP comment l'utiliser***
## B.1. Installation de jQuery
1. Installez la dernière version stable de jQuery avec la commande npm suivante :
1.**Installez la dernière version stable de jQuery** avec la commande npm suivante :
Le webservice `POST``/api/v1/pizzas` s'attend à recevoir en paramètre une chaîne JSON de la forme suivante (*les données doivent être remplacées par celles saisies par l'utilisateur dans le formulaire*) :
Le webservice `POST``/api/v1/pizzas` s'attend à recevoir en paramètre une chaîne JSON de la forme suivante (*les données doivent évidemment être remplacées par celles saisies par l'utilisateur dans le formulaire*) :
```json
{
"nom":"Savoyarde",
...
...
@@ -39,4 +39,8 @@ Si l'envoi s'est bien passé, le webservice retourne en entête un status `201 C
Si tout s'est bien passé, vous pouvez recharger la page et constater que la pizza que vous avez saisie dans le formulaire s'est ajoutée en bas de la liste sur la HomePage :
Pour finir, faites en sorte que lorsque le POST est terminé :
- une alerte s'affiche indiquant que l'enregistrement a réussi
- l'utilisateur retourne automatiquement sur la homepage avec la liste des pizzas à jour (sans qu'il ait à cliquer sur le bouton du menu et sans rechargement de page)
Pour plus de clarté, les instructions du TP se trouvent dans des fichiers distincts (un fichier par sujet), procédez dans l'ordre, sinon ça fonctionnera beaucoup moins bien ! :
