Question

我有一个字符串输入类型，我希望它保持字符串。但我希望用户在输入信息时从选项列表中进行选择。所以我想添加一个下拉列表，但我不知道该怎么做。我不想在后端创建任何模型或任何列表...我希望能够仅在视图上执行此操作。

这是我的初始代码：

<div class="form-group">
                @Html.LabelFor(model => model.EmployeeType, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.EmployeeType, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.EmployeeType, "", new { @class = "text-danger" })
                </div>
            </div>

Answer 1

看一下这个例子：http://www.asp.net/mvc/overview/older-versions/working-with-the-dropdownlist-box-and-jquery/using-the-dropdownlist-helper-with-aspnet-mvc

以下是在视图中创建下拉列表的一些基本代码：

@{    
    var listitems = new List<SelectListItem>();
    listitems.Add(new SelectListItem() { Text = "One", Value="1"});
    listitems.Add(new SelectListItem() { Text = "Two", Value="2"});
}

@Html.DropDownList("DropDownListValue", listitems)

Answer 2

我不确定您为什么要填写视图中的数据，但是您想要使用：

@Html.DropDownList

所以你的代码就像......一样......

<div class="form-group">
        @Html.LabelFor(model => model.EmployeeType, "Employee Type", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("EmployeeType", new SelectList(new List<string> { ... }, "EmployeeType", "SelectListName"), htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.EmployeeType, "", new { @class = "text-danger" })
        </div>
    </div>

显然你需要将你的字符串放入该列表中。我个人会在控制器中创建或获取列表并将其传递给ViewBag。那你就可以......

@Html.DropDownList("EmployeeType", new SelectList(ViewBag.EmployeeTypes, "EmployeeType", "SelectListName"), htmlAttributes: new { @class = "form-control" })

Answer 3

如果您不想使用任何viewmodels / Html帮助器方法来呈现您的下拉列表，您可以简单地使用纯Html。只需保留表单元素的名称，并将其用作HttpPost操作方法的参数。

@using(Html.Beginform())
{
  <input type="text" name="userName"/>
  <select name="state">
    <option value="MI">Michigan<option>
    <option value="OH">Ohio<option>
  </select>
}

你的HttpPost行动将是

[HttpPost]
public ActionResult Register (string userName,string state)
{
  //check the parameter values now
  // to do : Save and redirect.
}

如果您已经将ViewModel对象作为HttpPost操作方法的参数，则可以将SELECT元素名称添加为第二个参数，它仍然有效。

[HttpPost]
public ActionResult Register (CreateUserVM model,string state)
{
  //check the parameter values now
  // to do : Save and redirect.
}

我不确定您的确切用例，如果您要发布的表单元素超过1或2个，我建议使用视图模型并依赖MVC模型绑定。添加下拉数据到viewmodel并不是那么难。

public class CreateUserVM
{
  public string UserName {set;get;}

  public List<SelectListItem> EmployeeTypes {set;get;}
  public int SelectedType {set;get;}
}

在您的GET操作方法中，加载EmployeeTypes集合并将其发送到视图

public ActionResult Create()
{
  var vm= new CreateUserVM();
  vm.EmployeeTypes = GetEmployeeTypes();
  return View(vm);
}
public List<SelectListItem> GetEmployeeTypes()
{
    return new List<SelectListItem>()
    {
        new SelectListItem
        {
            Value = "1",
            Text = "PERM"
        },
        new SelectListItem
        {
                Value = "2",
                Text = "Temporary"
            }
    };
}

在您看来，

@model CreateUserVM
@using(Html.BeginForm())
{
  @Html.TextBoxFor(v=>v.UserName)
  @Html.DropdownListFor(s=>sSelectedType,Model.EmployeeTypes,"Select one")
}

在您的HttpPost操作中，阅读SelectedType属性以获取所选项的值。

[HttpPost]
public ActionResult Register (CreateUserVM model)
{
  //check the model.SelectedType
  // to do : Save and redirect.
}

如果您不想在服务器端代码中硬编码Employee Types，请创建db表并将其存储在那里并在GET操作方法中读取它。这将允许您在不触及代码的情况下向系统添加新的员工类型。

视图页面上的硬编码下拉列表

3 个答案: