diff --git a/C-formulaires.md b/C-formulaires.md index 9afabff7fdb2f8ac7a43b0321cea573621932ba7..30f36d6e5273549e2538f16f8ec0b294a8078a1a 100644 --- a/C-formulaires.md +++ b/C-formulaires.md @@ -14,10 +14,14 @@ Comme vu en cours (cf. pdf sur moodle), on peut utiliser l'API DOM avec les form - détecter la soumission du formulaire (pour envoyer des données en AJAX par exemple) ## C.2. Préparatifs -**Avant d'aller plus loin dans le TP faisons un point sur le code qui est fourni dans ce repo** : il contient en effet des classes `Page` et `PageRenderer` qui correspondent à la solution du précédent TP [D. POO avancée](https://gitlab.univ-lille.fr/js/tp2/blob/master/D-poo-avancee.md) : +**Avant d'aller plus loin dans le TP faisons un point sur le code qui est fourni dans ce repo** : il contient en effet des classes qui correspondent à la solution du précédent TP [D. POO avancée](https://gitlab.univ-lille.fr/js/tp2/blob/master/D-poo-avancee.md) : -- La classe `Page` est une classe de base dont hérite la classe `HomePage` et qui implémente une méthode `renderTitle()`. -- La classe `PageRenderer` est une classe qui dispose d'une méthode statique `PageRenderer.renderPage( page )`. Cette méthode permet d'afficher une page avec son contenu (méthode `page.render()`) et son titre (méthode `page.renderTitle()`). +- **La classe `js/pages/Page.js`** est une classe de base dont hériterons les pages de notre application et qui implémente juste une méthode `renderTitle()` qui retourne le titre de la page (passé dans le constructeur). +- **La classe `js/pages/HomePage.js`** hérite de `Page` et permet d'afficher une liste de pizzas passées soit au constructeur, soit à un setter `homePage.pizzas = ...`. Mettre à jour la liste des pizzas a pour effet de re-générer le tableau des children de la page. +- **La classe `js/components/PizzaThumbnail.js`** est une classe qui hérite de `Component` et qui permet d'afficher une pizza. Elle est utilisée dans `HomePage`. +- **Enfin la classe `js/PageRenderer.js`** est une classe qui dispose d'une méthode statique `PageRenderer.renderPage( page )` qui est appelée dans le `main.js`. Cette méthode permet d'afficher une page avec son contenu (méthode `page.render()`) et son titre (méthode `page.renderTitle()`). + +***Maintenant que les présentations sont faites, adaptons un peu le code pour préparer la suite du TP :*** Pour permettre à chaque page de réagir aux événements de l'utilisateur, on va ajouter une méthode `mount()` dans la classe `Page` et qui sera appelée par la classe `PageRenderer` à chaque fois qu'on affiche une page via `renderPage()` :