2 votes

ASP.net MVC 5 Boîte déroulante Razor

Bonjour à tous Je suis nouveau sur Razor MVC et je voulais faire une boîte de sélection qui a les 10 dernières années listées à l'intérieur (2016, 2015, 2014, etc....).

Voici mon code actuel pour les contrôleurs :

public ActionResult loadPast10Years()
{
    List<int> last10Years = new List<int>();
    int currentYear = DateTime.Now.Year;

    for (int i = currentYear - 10; i < currentYear; i++)
    {
        last10Years.Add(i);
    }

    ViewBag["last10Years"] = last10Years;

    return View();
}

Et mon code Razor :

@Html.DropDownList("last10Years", (SelectList)ViewBag["last10Years"], "--Select One--")

Mais j'ai une erreur lors du chargement de la page qui dit :

InvalidOperationException : Il n'existe pas d'élément ViewData de type 'IEnumerable' dont la clé est 'last10Years'.

Alors... Qu'est-ce que je rate ?

3voto

Izzy Points 3793

Voici comment je procéderais dans la vue

@Html.DropDownList("Last Ten Years", (IEnumerable<SelectListItem>)ViewBag.LastTenYears, "Select A Year")

et dans votre Action

List<int> last10Years = new List<int>();
int currentYear = DateTime.Now.Year;

for (int i = currentYear - 10; i < currentYear; i++)
{
  last10Years.Add(i);
}

ViewBag.LastTenYears = new SelectList(last10Years);

Vous pouvez voir une démo ici

Suite à votre commentaire, veuillez trouver ci-dessous ma réponse mise à jour.

Je dois d'abord créer un Model que nous allons utiliser dans notre vue. Dans cette classe de modèle, vous pouvez avoir vos propriétés appropriées. Pour l'instant, nous n'utiliserons que les propriétés suivantes SelectlistItem

donc notre classe ressemblera à

public class ViewModel
{
    public IEnumerable<SelectListItem> LastTenYears { get; set; }
}

Ensuite, dans notre contrôleur, nous pouvons créer une méthode qui nous fournira les informations pour notre liste déroulante.

public IEnumerable<SelectListItem> GetLastTenYears()
{
    List<SelectListItem> ddl = new List<SelectListItem>();
    int currentYear = DateTime.Now.Year;

    for (int i = currentYear - 10; i < currentYear; i++)
    {
       ddl.Add(new SelectListItem { Text = i.ToString(),  Value = i.ToString() });
    }

     IEnumerable<SelectListItem> lastTenYears = ddl;

     return lastTenYears;
}

Maintenant nous voulons passer ces données à la vue. Pour l'argument, je vais utiliser Index en tant que vue mais vous pouvez le passer à la vue de votre choix. Nous allons donc changer notre Index action pour

public ActionResult Index()
{
   ViewModel viewModel = new ViewModel();
   viewModel.LastTenYears = GetLastTenYears(); //get the drop down list

   return View(viewModel); //we're passing our Model to the view
}

Enfin, nous voulons être sûrs que notre vue sait quelle Model à utiliser, nous ferons donc ce qui suit au début de l'article. Index.cshtml fichier

@model YourNameSpace.ViewModel

et notre DropDownList sera maintenant modifiée pour pointer vers la propriété de notre méthode d'aide Model comme

@Html.DropDownList("Last Ten Years", Model.LastTenYears, "Please select a year")

0voto

Ehsan Sajjad Points 19405

Il y a quelques problèmes dans votre code en ce moment.

  • Ne nommez pas la clé ViewBag de la même façon que le nom de la DropDownList, ils ne fonctionnent pas bien ensemble. Vous pouvez remplacer le nom de la clé ViewBag par quelque chose comme last10YearsOptions. instead of last10Years`, afin qu'il soit différent du nom du contrôle.
  • Vous n'avez pas créé SelectList dans le contrôleur avant de l'ajouter à ViewBag mais vous le transformez en SelectList en vue.
  • En ViewBag sont stockées comme ViewBag.SomeKey= "SomeValue" mais vous le faites de la mauvaise façon.

Après avoir corrigé les problèmes ci-dessus, votre code sera comme suit :

ViewBag.last10YearsOptions = last10Years.Select(x => new SelectListItem() 
                                                     { 
                                                       Text = x.ToString(),
                                                       Value = x.ToString()
                                                     }
                                                );

et ensuite dans Vue :

@Html.DropDownList("last10Years",
                   "--Select One--", 
                   ViewBag.last10YearsOptions as IEnumerable<SelectListItem>,
                   null )

0voto

Ahmed Magdy Points 182

ViewBag n'est pas un dictionnaire avec des paires clé-valeur. De plus, la DropDownList fonctionne avec ICollection. donc ce code fonctionne sous la forme

@Html.DropDownList("last10Years", new SelectList(ViewBag.last10YearsOptions), "Select one from here")

0voto

erdi yılmaz Points 76

Le contrôleur est ici ;

public ActionResult loadPast10Years()
    {
        List<int> last10Years = new List<int>();  
        int currentYear = DateTime.Now.Year;
    for (int i = currentYear - 10; i < currentYear; i++)
    {
        last10Years.Add(i);
    }
    ViewBag.last10Years = new SelectList(last10Years);                       
    return View();
}

Et vue

@Html.DropDownList("last10Years", "--Select One--")

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X