CODEWITHSUNDEEP
c#asp.net-mvc
patswelund
patswelund

Reputation: 15

Why are the correct values not displayed in my @Html.DropDownListFor()?

I am a beginner at .NET MVC and trying to do a simple task such as displaying a list of items in a dropdown list. However my current code produces a dropdown list displaying the name of the type of the items instead of the actual values. Thanks for helping out. :)

DropDown not displaying the correct values

My code follows;

SelectArticleModel.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace TheMakingOfAWebApplication.Models
{
    public class SelectArticleModel
    {
        public string Name { get; set; }
        public IEnumerable<Article> Articles { get; set; }
    }
}

Article.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace TheMakingOfAWebApplication.Models
{
    public class Article
    {
        public string Name { get; set; }
    }
}

HomeController.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using TheMakingOfAWebApplication.Models;

namespace TheMakingOfAWebApplication.Controllers
{
    public class HomeController : Controller
    {
        // GET: Home
        public ActionResult Index()
        {
            //List<Article> articles;

            SelectArticleModel model = new SelectArticleModel();
            model.Name = "";
            model.Articles = new List<Article>{
                new Article { Name = "Bananas"},
                new Article { Name = "Apples"},
                new Article { Name = "Oranges"},
                new Article { Name = "Melons"},
                new Article { Name = "Grapes"},
                new Article { Name = "Sallad"},
                new Article { Name = "Potatoes"},
                new Article { Name = "Cucumber"},
                new Article { Name = "Beans"},
                new Article { Name = "Tomatoes"}
            };
            return View(model);
        }
    }
}

Index.cshtml

@model TheMakingOfAWebApplication.Models.SelectArticleModel

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Article</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.DropDownListFor(m => m.Name, new SelectList(Model.Articles))) 
                @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Save" class="btn btn-default" />
            </div>
        </div>
    </div>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

Upvotes: 1

Views: 183

Answers (2)

Siva Gopal
Siva Gopal

Reputation: 3502

Since you are using a complex object to bind, you can specify the dataTextField and dataValueField as arguments to SelectList. Try following:

@Html.DropDownListFor(m => m.Name, new SelectList(Model.Articles,"Name","Name"))

If you have a List of primitive types like string, the overload of SelectList you are using would work without mentioning extra parameters.

Upvotes: 0

JamieD77
JamieD77

Reputation: 13949

Let your SelectList know what the Value and Text property names are.

@Html.DropDownListFor(m => m.Name, 
                 new SelectList(Model.Articles, "Name", "Name", Model.Name)))

Upvotes: 2

Related Questions