Question

在MVC中正确创建下拉列表时遇到一些问题。我不确定如何将下拉列表与模型链接，并为其创建值。现在我有以下代码创建2x下拉列表：

<div class="form-group">
        Outward route<br />
        <select class="dropdown" id="Dropdown-outward">
            <option>Copenhagen</option>
            <option>Oslo</option>
            <option>Stockholm</option>
        </select>
    </div>
    <div class="form-group">
        Return route<br />
        <select class="dropdown" id="Dropdown-return">
            <option>Option 1</option>
            <option>Option 2</option>
            <option>Option 3</option>
        </select>
    </div>

我使用了选择＆amp; option命令用于创建代码中显示的值。我知道你可以使用一些剃刀语法，如。

@Html. something

但我似乎无法做得对。创建了一个模型（预订），如下所示：

namespace Project.Models
{
public class Booking
{
    public int ID { get; set; }
    public string Departure { get; set; }
    public string Return { get; set; }
    public DateTime DepartureDate { get; set; }
    public DateTime ReturnDate { get; set; }
    public int Adults { get; set; }
    public int Childrens { get; set; }
}
}

如果我使用这样的Html帮助器：

@Html.DropDownList( )

我应该写什么来刺激牙箍？以及如何为其添加值，以便您可以选择，让我们说奥斯陆，哥本哈根和奥地利的城市。斯德哥尔摩？

Answer 1

如果你只需要这些值，你只需使用剃须刀，创建你的模型并迭代你的模型集合，如：

    <select class="dropdown" id="Dropdown-outward">
@foreach(var m in Model.Items)
{
        <option value="@m.ID">@m.ID</option>
 }
    </select>

这是一种可能的解决方案。您有下拉列表，可以使用您的模型识别所选值。

Answer 2

如果你想要的只是一个绑定到模型特定属性的简单下拉列表，那么你可以使用Html.DropdownListFor帮助器。将viewmodel与您的视图所需的属性结合使用始终是一种很好的做法。所以在这种情况下

public class BookingViewModel
{
    public Booking Booking { get; set; }
    public IEnumerable<SelectListItem> Cities { get; set; } // <-- for your dropdown
}

控制器：

[HttpGet]
public ActionResult Index()
    {
        var vm = new BookingViewModel();

        var citiesList = new List<SelectListItem>
        {
            new SelectListItem { Value = "Oslo", Text = "Oslo" },
            new SelectListItem { Value = "Copenhagen", Text = "Copenhagen" },
            new SelectListItem { Value = "Stockholm", Text = "Stockholm" }
        };


        vm.Cities = citiesList;
        return View(vm);
    }

查看：

@using (Html.BeginForm())
{
   @Html.DropDownListFor(s => s.Booking.Departure, Model.Cities)

   <button type="submit">Submit</button>
}

呈现您指定为<select id="Booking_Departure" name="Booking.Departure">的{{1}} ...和<options>。

最后你的帖子动作：

SelectListItems

下载列表与MVC（Asp.net网站）

2 个答案: