IEnumerable 模型中的多个 DropDownList
Multiple DropDownList in an IEnumerable Model
我正在使用 ASP.NET MVC 开发一个小型调查。我创建了我的模型 Question、QuestionCategory、Response、ResponseCategory 并用种子数据填充它们。
问题模型的索引视图运行良好,但我需要添加一个额外的字段,其中将包含每个问题的下拉列表,用户可以在其中使用选择的选项回答问题下拉列表。
下面是我的问题模型
public class Question
{
[Key]
public byte Id { get; set; }
[Required]
[Display(Name = "Survey Question")]
public string SurveyQuestion { get; set; }
public QuestionCategory QuestionCategory { get; set; }
[Display(Name = "Question Category")]
public byte QuestionCategoryId { get; set; }
}
这是我的问题类别模型
public class QuestionCategory
{
public byte Id { get; set; }
public string QuestionCat { get; set; }
}
这是响应模型
public class Response
{
public byte Id { get; set; }
public string ResponseName { get; set; }
public byte Weight { get; set; }
public ResponseCategory ResponseCategory { get; set; }
public byte ResponseCategoryId { get; set; }
}
这是 ResponseCategory 模型
public class ResponseCategory
{
public byte Id { get; set; }
public string ResponseCat { get; set; }
}
下面是 QuestionController 的 Index Action。
public ActionResult Index()
{
var questions = _context.Question.Include(q => q.QuestionCategory).ToList();
return View(questions);
}
下面最后是显示带有
问题的视图
@model IEnumerable<WorkPlaceBullying.Models.Question>
@{
ViewBag.Title = "Survey Questions";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Questions</h2>
@if (!Model.Any())
{
<p>We don't have any Questions yet!.</p>
}
@Html.ActionLink("Question", "New", "Question", "", new { @class = "btn btn-primary" })
<table class="table table-striped table-hover ">
<thead>
<tr>
<td>ID</td>
<td>Questions</td>
<td>Response Category</td>
</tr>
</thead>
@foreach (var question in Model)
{
<tr>
<td>@question.Id</td>
<td>
@Html.ActionLink(@question.SurveyQuestion, "Edit", "Question", new { id = @question.Id }, null)
</td>
<td>
@question.QuestionCategory.QuestionCat
</td>
<td>
@*@Html.DropDownListFor(q => q.Question.QuestionCategoryId, new SelectList(Model.QuestionCategory, "Id", "QuestionCat"), "Select Question Category", new { @class = "form-control" })*@
</td>
</tr>
}
</table>
我似乎无法放入问题控制器索引视图中的响应下拉列表。我们将不胜感激所有帮助。
SelectList Constructor 采用 IEnumerable,而不是 class。
在您的模型中创建一个包含 Model.QuestionCategory 的列表,并从中创建一个 SelectList。
public static IEnumerable<QuestionCategory> QuestionCategoryList = new List<QuestionCategory> {
new QuestionCategory {
Id = 1,
QuestionCat = "Red"
},
new QuestionCategory {
Id = 2,
QuestionCat = "Blue"
}
};
将视图中的代码更改为:
@Html.Hidden(@question.Id + "_QuestionCategoryId", @question.QuestionCategoryId)
@Html.DropDownList(@question.Id + "_QuestionCategoryId", new SelectList(QuestionCategoryList, "Id", "QuestionCat"), "Select Question Category", new { @class = "form-control", onchange="setQuestionCategoryId(this)" })
您可能需要一些 javascript 来更新 hidden input when the OnChange 事件触发。
请参阅此 jsfiddle 以了解如何使用 javascript 更新 QuestionCategoryId 值。
function setQuestionCategoryId(selectObject)
{
$("input#" + selectObject.id).val(selectObject.value);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="1_QuestionCategoryId" name="1_QuestionCategoryId" value="0" />
<select class="form-control" id="1_QuestionCategoryId" name="1_QuestionCategoryId" onchange="setQuestionCategoryId(this)">
<option>Select Question Category</option>
<option value="1">Red</option>
<option value="2">Blue</option>
</select>
下拉列表的语法:
MvcHtmlString Html.DropDownListFor(Expression<Func<dynamic,TProperty>> expression, IEnumerable<SelectLestItem> selectList, string optionLabel, object htmlAttributes)
例如:
@Html.DropDownListFor(m => m.StudentGender,
new SelectList(Enum.GetValues(typeof(Gender))),
"Select Gender")
在上面的示例中,DropDownListFor() 方法中的第一个参数是一个 lambda 表达式,它指定要与 select 元素绑定的模型 属性。我们指定了枚举类型的 StudentGender 属性。第二个参数指定要使用 SelectList 显示到下拉列表中的项目。第三个参数是 optionLabel,它将是下拉列表的第一项。所以现在,它生成的元素的 id 和名称设置为 属性 name - StudentGener 和两个列表项 - Male 和 Female,如下所示。
来源:http://www.tutorialsteacher.com/mvc/htmlhelper-dropdownlist-dropdownlistfor
我正在使用 ASP.NET MVC 开发一个小型调查。我创建了我的模型 Question、QuestionCategory、Response、ResponseCategory 并用种子数据填充它们。
问题模型的索引视图运行良好,但我需要添加一个额外的字段,其中将包含每个问题的下拉列表,用户可以在其中使用选择的选项回答问题下拉列表。
下面是我的问题模型
public class Question
{
[Key]
public byte Id { get; set; }
[Required]
[Display(Name = "Survey Question")]
public string SurveyQuestion { get; set; }
public QuestionCategory QuestionCategory { get; set; }
[Display(Name = "Question Category")]
public byte QuestionCategoryId { get; set; }
}
这是我的问题类别模型
public class QuestionCategory
{
public byte Id { get; set; }
public string QuestionCat { get; set; }
}
这是响应模型
public class Response
{
public byte Id { get; set; }
public string ResponseName { get; set; }
public byte Weight { get; set; }
public ResponseCategory ResponseCategory { get; set; }
public byte ResponseCategoryId { get; set; }
}
这是 ResponseCategory 模型
public class ResponseCategory
{
public byte Id { get; set; }
public string ResponseCat { get; set; }
}
下面是 QuestionController 的 Index Action。
public ActionResult Index()
{
var questions = _context.Question.Include(q => q.QuestionCategory).ToList();
return View(questions);
}
下面最后是显示带有
问题的视图@model IEnumerable<WorkPlaceBullying.Models.Question>
@{
ViewBag.Title = "Survey Questions";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Questions</h2>
@if (!Model.Any())
{
<p>We don't have any Questions yet!.</p>
}
@Html.ActionLink("Question", "New", "Question", "", new { @class = "btn btn-primary" })
<table class="table table-striped table-hover ">
<thead>
<tr>
<td>ID</td>
<td>Questions</td>
<td>Response Category</td>
</tr>
</thead>
@foreach (var question in Model)
{
<tr>
<td>@question.Id</td>
<td>
@Html.ActionLink(@question.SurveyQuestion, "Edit", "Question", new { id = @question.Id }, null)
</td>
<td>
@question.QuestionCategory.QuestionCat
</td>
<td>
@*@Html.DropDownListFor(q => q.Question.QuestionCategoryId, new SelectList(Model.QuestionCategory, "Id", "QuestionCat"), "Select Question Category", new { @class = "form-control" })*@
</td>
</tr>
}
</table>
我似乎无法放入问题控制器索引视图中的响应下拉列表。我们将不胜感激所有帮助。
SelectList Constructor 采用 IEnumerable,而不是 class。
在您的模型中创建一个包含 Model.QuestionCategory 的列表,并从中创建一个 SelectList。
public static IEnumerable<QuestionCategory> QuestionCategoryList = new List<QuestionCategory> {
new QuestionCategory {
Id = 1,
QuestionCat = "Red"
},
new QuestionCategory {
Id = 2,
QuestionCat = "Blue"
}
};
将视图中的代码更改为:
@Html.Hidden(@question.Id + "_QuestionCategoryId", @question.QuestionCategoryId)
@Html.DropDownList(@question.Id + "_QuestionCategoryId", new SelectList(QuestionCategoryList, "Id", "QuestionCat"), "Select Question Category", new { @class = "form-control", onchange="setQuestionCategoryId(this)" })
您可能需要一些 javascript 来更新 hidden input when the OnChange 事件触发。
请参阅此 jsfiddle 以了解如何使用 javascript 更新 QuestionCategoryId 值。
function setQuestionCategoryId(selectObject)
{
$("input#" + selectObject.id).val(selectObject.value);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="1_QuestionCategoryId" name="1_QuestionCategoryId" value="0" />
<select class="form-control" id="1_QuestionCategoryId" name="1_QuestionCategoryId" onchange="setQuestionCategoryId(this)">
<option>Select Question Category</option>
<option value="1">Red</option>
<option value="2">Blue</option>
</select>
下拉列表的语法:
MvcHtmlString Html.DropDownListFor(Expression<Func<dynamic,TProperty>> expression, IEnumerable<SelectLestItem> selectList, string optionLabel, object htmlAttributes)
例如:
@Html.DropDownListFor(m => m.StudentGender,
new SelectList(Enum.GetValues(typeof(Gender))),
"Select Gender")
在上面的示例中,DropDownListFor() 方法中的第一个参数是一个 lambda 表达式,它指定要与 select 元素绑定的模型 属性。我们指定了枚举类型的 StudentGender 属性。第二个参数指定要使用 SelectList 显示到下拉列表中的项目。第三个参数是 optionLabel,它将是下拉列表的第一项。所以现在,它生成的元素的 id 和名称设置为 属性 name - StudentGener 和两个列表项 - Male 和 Female,如下所示。
来源:http://www.tutorialsteacher.com/mvc/htmlhelper-dropdownlist-dropdownlistfor