Exercice 1
Créez un nouveau projet “Web application” dan Visual studio. Appelez le “Exercice_Cours_5”. Eliminer les pages web et layout offert par défaut.
Exercice 2
Créez une base de données “Exercice_Cours_5”. Créez-y une table client avec les champs suivant:
- id_client (Clé primaire numérique auto-incrémentée)
- prenom (varchar 50)
- nom (varchar 50)
- courriel (varchar 50)
- telephone (varchar 50)
Entrez-y les informations suivantes:
- Jean, Dufour, jean.dufour@hotmail.com, (819)-123-5678
- Alexandre, Tremblay, alexandre.tremblay@hotmail.com, (819)-123-4567
- Christian, Cordonier, christian.cordonier@hotmail.com, (819)-987-6543
Exercice 3
Créez un Layout “_Layout.cshtml” qui ne contient rien d’autre que le HTML5 fournit par défaut. Le reste pourra être adapté au fur et à mesure des exercices qui suivrons. Toutes les pages du projet utiliserons ce Layout.
Exercice 4
Créez une page “Index” qui affiche le contenu de la table “Client” sous forme de tableau. Les champs sont: id_client, prenom, nom, courriel, telephone. Assurez-vous que le tableau utilise le style fournit par la librairie “Bootstrap”.
Exercice 5
Ajoutez un bouton “Ajouter” au bas du tableau. Faites en sorte qu’un formulaire soit offert pour ajouter un nouveau client. Lorsque le formulaire est soumis, le client est ajouter et la page “Index” est immédiatement affichée.
Exercice 6
Ajoutez une colonne supplémentaire au tableau afin d’afficher un bouton “Modifier” pour chacune des entrée. Lorsqu’un de ces boutons est cliqué, un formulaire de modification, déjà remplit avec les informations du client, est affichée. Assurez-vous que le champ “id_client” ne puisse pas être modifié, et que sa couleur de fond soit légèrement grise. Utiliser une feuille CSS pour définir cette propriété. Lorsque le formulaire est soumis, le client est modifié et la page “Index” est affichée.
Exercice 7
Ajouter une colonne supplémentaire au tableau de la page “Index”. Cette colonne contient des boutons “Supprimer” pour chacune des entrées. Si ce bouton est appuyé, l’entrée est supprimé et la page “Index” est affichée de nouveau.