Accueil > Non classé > ASP.NET MVC 4 [Quatrième partie] : Ajout d’une vue

ASP.NET MVC 4 [Quatrième partie] : Ajout d’une vue

Vue2

  1. ASP.NET MVC 4 [Première partie]   : Introduction
  2. ASP.NET MVC 4 [Deuxième partie]  : Ajout d’un model
  3. ASP.NET MVC 4 [Troisième partie]  : Ajout d’un contrôleur
  4. ASP.NET MVC 4 [Quatrième partie] : Ajout d’une vue
  5. ASP.NET MVC 4 [Cinquième partie] : Page Inspector
  6. ASP.NET MVC 4 [Sixième partie]      : Razor ou ASPX
  7. ASP.NET MVC 4 [Septième partie]   : Conclusion

Petit rappel, La vue : affiche le contenu envoyé par le contrôleur dans un fureteur (navigateur). Utilisé par l’application pour générer dynamiquement des réponses HTML.

Modification du fichier _Layout.cshtml

Nous allons modifier le contenu du fichier _Layout.cshtml qui se trouve dans le dossier “Views/Shared”.

 

image

 

Titre de la page :

<title>@ViewBag.Title - CSMvc4 en action</title>

La ViewBag est un objet dynamique. Cet objet ne possède aucune propriété défini, et ce jusqu’à ce que vous lui fournissez des données. Je vous montrerai une petite démo dans la suite.

 

En tête de notre page :

image


ActionLink est une méthode qui retourne l’élément d’encrage qui contient le chemin d’accès virtuel de l’action spécifiée.

Le premier paramètre (ici CSMvc4 en action) est le lien.

Le second (ici Index) est l’action.

Le troisième (ici Home) est le contrôleur.

 

Ayant fait le tour de ce fichier, modifions rapidement (pas de code ici) les 3 fichiers qui se trouvent dans Views/Home, ainsi que le fichier HomeControleur.cs

Page après modification :

image

Ajout d’une vue et Démo sur la ViewBag

Pour ajouter une vue, positionner le curseur sur une action et faites un click droit, puis Ajouter une vue.

 

Pour la démo de la ViewBag

Ajoutons une action dans le contrôleur :

public ActionResult ViewBagDemo(string name = "Nesta", string year = "2002") { ViewBag.Message = "Démontration de la ViewBag par " + name; ViewBag.Annee = year; return View(); } 

 

Créer  la vue ViewBagDemo.cshml

image

image


Résultat :

image

Voici à quoi ressemble notre application :

image

<image>

 

Création d’un adhérent

image

 

Validation des champs

Si une mauvaise date est saisie par exemple, un message de validation est affichée. Nous verrons plus loin, comment ajouter des validations à notre model.

image

 

Éditer un adhérent

image

 

Supprimer un Adhérent

image

 

Détail d’un adhérent

image

 

Be connected!

Loading

Categories: Non classé Tags:
  1. Pas encore de commentaire
  1. Pas encore de trackbacks


3 + huit =