web-dev-qa-db-fra.com

Comment créer une liste déroulante statique dans la syntaxe Razor?

Après des heures de recherche sur Google et Stack Overflow, je ne peux pas trouver un exemple sanglant de la façon de construire une liste déroulante simple totalement sans cervelle qui ne provienne pas d'une base de données. Honnêtement, j'ai du mal à comprendre la MVC. Quelqu'un peut-il me montrer comment créer ceci:

<select name="FooBarDropDown" id="FooBarDropDown">
    <option value="Option1" selected>This is Option 1</option>
    <option value="Option2">This is Option 2</option>
    <option value="Option3">This is Option 3</option>
</select>

En utilisant ceci:

@Html.DropDownList....

Je recherche une solution tout-en-un ... tout en vue. J'ai un diable de temps avec la syntaxe.

15
Casey Crookston

Je pense que c'est ce que vous recherchez. Il serait préférable de refactoriser la construction de la liste dans le modèle de vue ou dans le contrôleur.

@Html.DropDownList("FooBarDropDown", new List<SelectListItem>
{
    new SelectListItem{ Text="Option 1", Value = "1" },
    new SelectListItem{ Text="Option 2", Value = "2" },
    new SelectListItem{ Text="Option 3", Value = "3" },
 }) 

Un exemple de placement de ceci dans le contrôleur pourrait ressembler à ceci:

public ActionResult ExampleView()
{
    var list = new List<SelectListItem>
    {
        new SelectListItem{ Text="Option 1", Value = "1" },
        new SelectListItem{ Text="Option 2", Value = "2" },
        new SelectListItem{ Text="Option 3", Value = "3", Selected = true },
    }; 

    ViewData["foorBarList"] = list;
    return View();
}

Et puis à votre avis:

@Html.DropDownList("fooBarDropDown", ViewData["list"] as List<SelectListItem>)

Si c'est vraiment une liste statique que vous pourriez avoir à réutiliser dans d'autres vues/contrôleurs, alors j'envisagerais de mettre cette logique dans une classe statique. Exemple:

public static class DropDownListUtility
{   
    public static IEnumerable<SelectListItem> GetFooBarDropDown(object selectedValue)
    {
        return new List<SelectListItem>
        {
            new SelectListItem{ Text="Option 1", Value = "1", Selected = "1" == selectedValue.ToString()},
            new SelectListItem{ Text="Option 2", Value = "2", Selected = "2" == selectedValue.ToString()},
            new SelectListItem{ Text="Option 3", Value = "3", Selected = "3" == selectedValue.ToString()},
        };             
    }

Ce qui vous laisse ensuite plusieurs façons d'accéder à la liste.

Exemple de contrôleur:

public ActionResult ExampleView()
{
    var list = DropDownListUtility.GetFooBarDropDown("2"); //select second option by default;
    ViewData["foorBarList"] = list;
    return View();
}

Voir l'exemple:

@Html.DropDownList("fooBarDropDown", DropDownListUtility.GetFooBarDropDown("2"))
34
Brandon O'Dell

Jetez un œil aux documents pour cette surcharge

public static MvcHtmlString DropDownList(
  this HtmlHelper htmlHelper,
  string name,
  IEnumerable<SelectListItem> selectList
)

Il suffit donc d'ajouter une référence à votre List<SelectListItem>() avec vos options.

List<SelectListItem> items = new List<SelectListItem>();
 items.Add(new SelectListItem { Text = "Option1", Value = "Option1"});
 items.Add(new SelectListItem { Text = "Option2", Value = "Option2" });
 items.Add(new SelectListItem { Text = "Option3", Value = "Option3", Selected = true });

Vous pouvez même intégrer cela à votre vue si vous ne voulez pas le transmettre depuis votre contrôleur.

@{
    List<SelectListItem> items = ...
}

Ensuite, utilisez-le

@Html.DropDownList("FooBarDropDown", items)
3
Jasen