IEnumerable模型中的多个DropDownList

时间:2017-07-09 20:44:47

标签: c# asp.net asp.net-mvc asp.net-mvc-4 razorengine

我正在使用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; }             
}

这是我的QuestionCategory模型

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的索引操作。

    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>

我似乎无法在问题控制器的索引视图中的响应下拉列表中找到它。非常感谢所有帮助。

2 个答案:

答案 0 :(得分:2)

SelectList Constructor采用IEnumerable而不是类。

在模型中创建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)" })

hidden input事件触发时,您可能需要一些javascript来更新OnChange

有关如何使用javascript更新QuestionCategoryId值,请参阅此jsfiddle

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>

答案 1 :(得分:1)

dropdownlistfor的语法:

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元素绑定的model属性。我们指定了枚举类型的StudentGender属性。第二个参数使用SelectList指定要显示在下拉列表中的项目。第三个参数是optionLabel,它将是下拉列表的第一项。所以现在,它生成了带有id和amp的元素。名称设置为属性名称 - StudentGener和两个列表项 - Male&amp;女性如下图所示。

来源:http://www.tutorialsteacher.com/mvc/htmlhelper-dropdownlist-dropdownlistfor