C# ASP.NET MVC Forms Improving Our Form Drop Down Lists

ASP.NET MVC FORMS -AGAIN

Link to question: https://teamtreehouse.com/library/aspnet-mvc-forms/improving-our-form/drop-down-lists

Question:

In Report.cshtml update the "Department" field to use a drop down list.

    Replace the Html.TextBoxFor method call with a call to the Html.DropDownListFor HTML helper method.
    Assume that a collection of select list items (of type SelectList) is available via the ViewBag.DepartmentsSelectListItems property.

Code Provided

@model IssueReporter.Models.Issue

@{
    ViewBag.Title = "Report an Issue";
}

<h2>@ViewBag.Title</h2>

@using (Html.BeginForm())
{
    <div>
        @Html.LabelFor(m => m.Name)
        @Html.TextBoxFor(m => m.Name)
    </div>

    <div>
        @Html.LabelFor(m => m.Email)
        @Html.TextBoxFor(m => m.Email)
    </div>

    <div>
        @Html.LabelFor(m => m.DepartmentId)
        @Html.TextBoxFor(m => m.DepartmentId)
    </div>

    <div>
        @Html.LabelFor(m => m.Severity)
        @Html.TextBoxFor(m => m.Severity)
    </div>

    <div>
        @Html.LabelFor(m => m.Reproducible)
        @Html.TextBoxFor(m => m.Reproducible)
    </div>

    <div>
        @Html.LabelFor(m => m.DescriptionOfProblem)
        @Html.TextAreaFor(m => m.DescriptionOfProblem)
    </div>

    <button type="submit">Save</button>
}

My attempt:

@model IssueReporter.Models.Issue

@{
    ViewBag.Title = "Report an Issue";
}

<h2>@ViewBag.Title</h2>

@using (Html.BeginForm())
{
    <div>
        @Html.LabelFor(m => m.Name)
        @Html.TextBoxFor(m => m.Name)
    </div>

    <div>
        @Html.LabelFor(m => m.Email)
        @Html.TextBoxFor(m => m.Email)
    </div>

    <div>
        @Html.LabelFor(m => m.DepartmentId)
        @Html.DropDownListFor(m => m.DepartmentId, (SelectList)ViewBag.DepartmentIdSelectListItems, new { @class = "form-control"})
    </div>

    <div>
        @Html.LabelFor(m => m.Severity)
        @Html.TextBoxFor(m => m.Severity)
    </div>

    <div>
        @Html.LabelFor(m => m.Reproducible)
        @Html.TextBoxFor(m => m.Reproducible)
    </div>

    <div>
        @Html.LabelFor(m => m.DescriptionOfProblem)
        @Html.TextAreaFor(m => m.DescriptionOfProblem)
    </div>

    <button type="submit">Save</button>
}

Error Message on this attempt:

Did you replace the 'DepartmentId' field's Html.TextBoxFor method call with a call to the Html.DropDownListFor HTML helper method?
Report.cshtml
@model IssueReporter.Models.Issue

@{
    ViewBag.Title = "Report an Issue";
}

<h2>@ViewBag.Title</h2>

@using (Html.BeginForm())
{
    <div>
        @Html.LabelFor(m => m.Name)
        @Html.TextBoxFor(m => m.Name)
    </div>

    <div>
        @Html.LabelFor(m => m.Email)
        @Html.TextBoxFor(m => m.Email)
    </div>

    <div>
        @Html.LabelFor(m => m.DepartmentId)
        @Html.DropDownListFor(m => m.DepartmentId, (SelectList)ViewBag.DepartmentIdSelectListItems, new { @class = "form-control"})
    </div>

    <div>
        @Html.LabelFor(m => m.Severity)
        @Html.TextBoxFor(m => m.Severity)
    </div>

    <div>
        @Html.LabelFor(m => m.Reproducible)
        @Html.TextBoxFor(m => m.Reproducible)
    </div>

    <div>
        @Html.LabelFor(m => m.DescriptionOfProblem)
        @Html.TextAreaFor(m => m.DescriptionOfProblem)
    </div>

    <button type="submit">Save</button>
}

1 Answer

Steven Parker
Steven Parker
205,587 Points

It looks like you used the wrong property name.

The challenge says that a list of items "is available via the ViewBag.DepartmentsSelectListItems property", but you wrote "ViewBag.DepartmentIdSelectListItems" instead.