SelectList 在我不希望渲染时使用 multiple = "multiple"
SelectList rendering with multiple = "multiple" when I don't want it to
我正在尝试创建一个简单的 SelectList
,它呈现为 dropdown
,用于用 RazorPages 生成的创建表单。出于某种原因,SelectList
使用 multiple="multiple"
呈现,这导致所有选项都显示在一个框架中,侧面有一个滚动条,而不是 dropdown
。我认为问题在于我的控制器以及我正在尝试使用匿名类型设置 SelectListItems
的 "Text" 和 "Value" 属性,因为我已经达到了预期的结果当不设置这些属性时。
其中很多内容对我来说都是全新的,所以如果有人对我的代码有任何一般性建议,我将不胜感激。
这是我的视图模型:
public class CreateFileViewModel
{
public SelectList EnrolleeId { get; set; }
public SelectList GroupId { get; set; }
[DataType(DataType.Date)]
public DateTime StartDate { get; set; }
public string Status { get; set; }
}
这是我的控制器:
public IActionResult TestCreate()
{
//query items for SelectLists
var users = from u in _context.Users
orderby u.LastName
select u;
var groups = from g in _context.Group
orderby g.Name
select g;
// Loop through queries above and convert to collections of SelectListItems
var enrolleeSelectListItems = from u in users
select new SelectListItem()
{
Value = u.Id.ToString(),
Text = u.LastName + ", " + u.FirstName + " " + u.MiddleName
};
var groupSelectListItems = from g in groups
select new SelectListItem()
{
Value = g.ID.ToString(),
Text = g.Name
};
//convert SelectListItem collections into SelectLists within view
var cfvm = new Models.TestModels.CreateFileViewModel();
cfvm.EnrolleeId = new SelectList(enrolleeSelectListItems, "Value", "Text");
cfvm.GroupId = new SelectList(groupSelectListItems, "Value", "Text");
return View(cfvm);
}
这是我观点的相关部分:
<div class="form-group">
<label asp-for="EnrolleeId" class="control-label"></label>
<select asp-for="EnrolleeId" asp-items="Model.EnrolleeId">
<option value="">Select</option>
</select>
</div>
这是它在浏览器中的呈现方式:
<select id="EnrolleeId" multiple="multiple" name="EnrolleeId" aria-invalid="false" class="valid">
<option value="">Select</option>
<option value="3e60fabd-6901-45a1-ae2a-5056d77f415c"></option>
<option value="40ce8b6e-62a5-4c3c-808b-90e36d633ec0"></option>
<option value="c0c49df2-da52-4a01-9a8a-47bab6f5496d"></option>
</select>
因为您用于 asp-for
(EnrolleeId
) 的 属性 是集合类型。 SelectList
实施 IEnumerable
理想情况下,您应该有 2 个属性,一个用于构建选项列表所需的项目集合,一个用于 selected 选项值
public class CreateFileViewModel
{
public int SelectedEnrolleId {set;get;} // This new one
public SelectList EnrolleeId { get; set; }
public SelectList GroupId { get; set; }
[DataType(DataType.Date)]
public DateTime StartDate { get; set; }
public string Status { get; set; }
}
并在视图中
<select asp-for="SelectedEnrolleId" asp-items="Model.EnrolleeId">
<option value="">Select</option>
</select>
这将呈现名称和 ID 属性值设置为 SelectedEnrolleId
的 select 元素。因此,当您提交表单时,您应该从那里阅读它。
我正在尝试创建一个简单的 SelectList
,它呈现为 dropdown
,用于用 RazorPages 生成的创建表单。出于某种原因,SelectList
使用 multiple="multiple"
呈现,这导致所有选项都显示在一个框架中,侧面有一个滚动条,而不是 dropdown
。我认为问题在于我的控制器以及我正在尝试使用匿名类型设置 SelectListItems
的 "Text" 和 "Value" 属性,因为我已经达到了预期的结果当不设置这些属性时。
其中很多内容对我来说都是全新的,所以如果有人对我的代码有任何一般性建议,我将不胜感激。
这是我的视图模型:
public class CreateFileViewModel
{
public SelectList EnrolleeId { get; set; }
public SelectList GroupId { get; set; }
[DataType(DataType.Date)]
public DateTime StartDate { get; set; }
public string Status { get; set; }
}
这是我的控制器:
public IActionResult TestCreate()
{
//query items for SelectLists
var users = from u in _context.Users
orderby u.LastName
select u;
var groups = from g in _context.Group
orderby g.Name
select g;
// Loop through queries above and convert to collections of SelectListItems
var enrolleeSelectListItems = from u in users
select new SelectListItem()
{
Value = u.Id.ToString(),
Text = u.LastName + ", " + u.FirstName + " " + u.MiddleName
};
var groupSelectListItems = from g in groups
select new SelectListItem()
{
Value = g.ID.ToString(),
Text = g.Name
};
//convert SelectListItem collections into SelectLists within view
var cfvm = new Models.TestModels.CreateFileViewModel();
cfvm.EnrolleeId = new SelectList(enrolleeSelectListItems, "Value", "Text");
cfvm.GroupId = new SelectList(groupSelectListItems, "Value", "Text");
return View(cfvm);
}
这是我观点的相关部分:
<div class="form-group">
<label asp-for="EnrolleeId" class="control-label"></label>
<select asp-for="EnrolleeId" asp-items="Model.EnrolleeId">
<option value="">Select</option>
</select>
</div>
这是它在浏览器中的呈现方式:
<select id="EnrolleeId" multiple="multiple" name="EnrolleeId" aria-invalid="false" class="valid">
<option value="">Select</option>
<option value="3e60fabd-6901-45a1-ae2a-5056d77f415c"></option>
<option value="40ce8b6e-62a5-4c3c-808b-90e36d633ec0"></option>
<option value="c0c49df2-da52-4a01-9a8a-47bab6f5496d"></option>
</select>
因为您用于 asp-for
(EnrolleeId
) 的 属性 是集合类型。 SelectList
实施 IEnumerable
理想情况下,您应该有 2 个属性,一个用于构建选项列表所需的项目集合,一个用于 selected 选项值
public class CreateFileViewModel
{
public int SelectedEnrolleId {set;get;} // This new one
public SelectList EnrolleeId { get; set; }
public SelectList GroupId { get; set; }
[DataType(DataType.Date)]
public DateTime StartDate { get; set; }
public string Status { get; set; }
}
并在视图中
<select asp-for="SelectedEnrolleId" asp-items="Model.EnrolleeId">
<option value="">Select</option>
</select>
这将呈现名称和 ID 属性值设置为 SelectedEnrolleId
的 select 元素。因此,当您提交表单时,您应该从那里阅读它。