使用 Razor 实现 MVC 4中的 DropDownList

我试着在剃须刀的视角下创建一个 DropDownList。

有人能帮帮我吗？

正常的 HTML5代码:

<select id="dropdowntipo">
<option value="Exemplo1">Exemplo1</option>
<option value="Exemplo2">Exemplo2</option>
<option value="Exemplo3">Exemplo3</option>
</select>

我试过了:

@{
var listItems = new List<ListItem> {
new ListItem { Text = "Exemplo1", Value = "Exemplo1" },
new ListItem { Text = "Exemplo2", Value = "Exemplo2" },
new ListItem { Text = "Exemplo3", Value = "Exemplo3" }
};
}


@Html.DropDownListFor(model =>
model.tipo,
new SelectList(listItems),
"-- Select Status --"
)
566657 次浏览
小开
最佳答案 
@{
List<SelectListItem> listItems= new List<SelectListItem>();
listItems.Add(new SelectListItem
{
Text = "Exemplo1",
Value = "Exemplo1"
});
listItems.Add(new SelectListItem
{
Text = "Exemplo2",
Value = "Exemplo2",
Selected = true
});
listItems.Add(new SelectListItem
{
Text = "Exemplo3",
Value = "Exemplo3"
});
}


@Html.DropDownListFor(model => model.tipo, listItems, "-- Select Status --")
小开 
@{var listItems = new List<ListItem>
{
new ListItem { Text = "Exemplo1", Value="Exemplo1" },
new ListItem { Text = "Exemplo2", Value="Exemplo2" },
new ListItem { Text = "Exemplo3", Value="Exemplo3" }
};
}
@Html.DropDownList("Exemplo",new SelectList(listItems,"Value","Text"))
小开

你可以用这个:

@Html.DropDownListFor(x => x.Tipo, new List<SelectListItem>
{
new SelectListItem() {Text = "Exemplo1", Value="Exemplo1"},
new SelectListItem() {Text = "Exemplo2", Value="Exemplo2"},
new SelectListItem() {Text = "Exemplo3", Value="Exemplo3"}
})
小开

使用数组比创建列表更有效一些。

@Html.DropDownListFor(x => x.Tipo, new SelectListItem[]{
new SelectListItem() {Text = "Exemplo1", Value="Exemplo1"},
new SelectListItem() {Text = "Exemplo2", Value="Exemplo2"},
new SelectListItem() {Text = "Exemplo3", Value="Exemplo3"}})
小开

如果你正在使用 ASP.net 5(MVC 6)或更高版本，那么你可以使用 新标签助手作为一个非常好的语法:

<select asp-for="tipo">
<option value="Exemplo1">Exemplo1</option>
<option value="Exemplo2">Exemplo2</option>
<option value="Exemplo3">Exemplo3</option>
</select>
小开 
@{
List<SelectListItem> listItems= new List<SelectListItem>();
listItems.Add(new SelectListItem
{
Text = "One",
Value = "1"
});
listItems.Add(new SelectListItem
{
Text = "Two",
Value = "2",
});
listItems.Add(new SelectListItem
{
Text = "Three",
Value = "3"
});
listItems.Add(new SelectListItem
{
Text = "Four",
Value = "4"
});
listItems.Add(new SelectListItem
{
Text = "Five",
Value = "5"
});
}
@Html.DropDownList("DDlDemo",new SelectList(listItems,"Value","Text"))

参考:-在 MVC 4剃须刀示例中创建下拉列表

小开

//ViewModel

public class RegisterViewModel
{


public RegisterViewModel()
{
ActionsList = new List<SelectListItem>();
}


public IEnumerable<SelectListItem> ActionsList { get; set; }


public string StudentGrade { get; set; }


}

//枚举类别:

public enum GradeTypes
{
A,
B,
C,
D,
E,
F,
G,
H
}

//控制员行动

 public ActionResult Student()
{
RegisterViewModel vm = new RegisterViewModel();
IEnumerable<GradeTypes> actionTypes = Enum.GetValues(typeof(GradeTypes))
.Cast<GradeTypes>();
vm.ActionsList = from action in actionTypes
select new SelectListItem
{
Text = action.ToString(),
Value = action.ToString()
};
return View(vm);
}

//查看行动

 <div class="form-group">
<label class="col-lg-2 control-label" for="hobies">Student Grade:</label>
<div class="col-lg-10">
@Html.DropDownListFor(model => model.StudentGrade, Model.ActionsList, new { @class = "form-control" })
</div>
小开

这是最简单的答案:

在你看来，只要加上:

@Html.DropDownListFor(model => model.tipo, new SelectList(new[]{"Exemplo1",
"Exemplo2", "Exemplo3"}))

或者 在控制器中添加:

var exemploList= new SelectList(new[] { "Exemplo1:", "Exemplo2", "Exemplo3" });
ViewBag.ExemploList = exemploList;

你的观点就是:

@Html.DropDownListFor(model => model.tipo, (SelectList)ViewBag.ExemploList )

我跟杰茜 · 查德威克学的

小开

用这个

public ActionResult LoadCountries()
{
List<SelectListItem> li = new List<SelectListItem>();
li.Add(new SelectListItem { Text = "Select", Value = "0" });
li.Add(new SelectListItem { Text = "India", Value = "1" });
li.Add(new SelectListItem { Text = "Srilanka", Value = "2" });
li.Add(new SelectListItem { Text = "China", Value = "3" });
li.Add(new SelectListItem { Text = "Austrila", Value = "4" });
li.Add(new SelectListItem { Text = "USA", Value = "5" });
li.Add(new SelectListItem { Text = "UK", Value = "6" });
ViewData["country"] = li;
return View();
}

以及在视图中使用。

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

如果希望从数据集获取数据并在列表框中填充这些数据，请使用以下代码。

List<SelectListItem> li= new List<SelectListItem>();
for (int rows = 0; rows <= ds.Tables[0].Rows.Count - 1; rows++)
{
li.Add(new SelectListItem { Text = ds.Tables[0].Rows[rows][1].ToString(), Value = ds.Tables[0].Rows[rows][0].ToString() });
}
ViewData["FeedBack"] = li;
return View();

并在视图中编写以下代码。

@Html.DropDownList("FeedBack", ViewData["FeedBack"] as List<SelectListItem>)
小开 

List<tblstatu> status = new List<tblstatu>();
status = psobj.getstatus();
model.statuslist = status;
model.statusid = status.Select(x => new SelectListItem
{
Value = x.StatusId.ToString(),
Text = x.StatusName
});




@Html.DropDownListFor(m => m.status_id, Model.statusid, "Select", new { @class = "form-control input-xlarge required", @type = "text", @autocomplete = "off" })

小开

相信我，我已经试过很多方法了 我在这里有答案

但是我一直在寻找最佳实践，目前为止我所知道的对于前端和后端开发人员来说最好的方法是 for loop(是的，我不是在开玩笑)

因为当前端为您提供带有虚拟数据的 UI Pages 时，他还在特定的选择选项上添加了类和一些内联样式，所以它的 hard to deal使用 HtmlHelper

看看这个:

<select class="input-lg" style="">
<option value="0" style="color:#ccc !important;">
Please select the membership name to be searched for
</option>
<option value="1">11</option>
<option value="2">22</option>
<option value="3">33</option>
<option value="4">44</option>
</select>

因此最好的解决方案是使用 for 循环

首先将来自(...)的数据的 create或 get your list放入控制器操作中，并将其放入 ViewModel、 ViewBag 或其他

//This returns object that contain Items and TotalCount
ViewBag.MembershipList = await _membershipAppService.GetAllMemberships();

其次在视图中做这个简单的 for 循环来填充下拉列表

<select class="input-lg" name="PrerequisiteMembershipId" id="PrerequisiteMembershipId">
<option value="" style="color:#ccc !important;">
Please select the membership name to be searched for
</option>
@foreach (var item in ViewBag.MembershipList.Items)
{
<option value="@item.Id" @(Model.PrerequisiteMembershipId == item.Id ? "selected" : "")>
@item.Name
</option>
}
</select>

这样你就不会破坏 UI 设计，而且它简单、易读

希望这对你有帮助，即使你没有使用剃刀

小开

这也可以这样做

@model IEnumerable<ItemList>


<select id="dropdowntipo">
<option value="0">Select Item</option>
    

@{
foreach(var item in Model)
{
<option value= "@item.Value">@item.DisplayText</option>
}
}


</select>

小开

对于那些使用 .NET 核心 MVC的人，他们偶然发现了这个:

如果您的模型有一个属性枚举，您可以简单地输入:

<select asp-for="MyEnum" asp-items="Html.GetEnumSelectList<MyEnum>()"/>

见: https://learn.microsoft.com/en-us/aspnet/core/mvc/views/working-with-forms?view=aspnetcore-6.0#enum-binding

希望这对谁有帮助。


提交答案