Asp.Net MVC with Drop Down List, and SelectListItem Assistance

Question

I am trying to build a Dropdownlist, but battling with the Html.DropDownList rendering.

I have a class:

public class AccountTransactionView
{
    public IEnumerable<SelectListItem> Accounts { get; set; }
    public int SelectedAccountId { get; set; }
}

That is basically my view model for now. The list of Accounts, and a property for returning the selected item.

In my controller, I get the data ready like this:

public ActionResult AccountTransaction(AccountTransactionView model)
{
    List<AccountDto> accounts = Services.AccountServices.GetAccounts(false);

    AccountTransactionView v = new AccountTransactionView
    {
        Accounts = (from a in accounts
                    select new SelectListItem
                    {
                        Text = a.Description,
                        Value = a.AccountId.ToString(),
                        Selected = false
                    }),
    };

    return View(model);
}

Now the problem:

I am then trying to build the Drop down in my view:

<%=Html.DropDownList("SelectedAccountId", Model.Accounts) %>

I am getting the following error:

The ViewData item that has the key 'SelectedAccountId' is of type 'System.Int32' but must be of type 'IEnumerable'.

Why would it want me to return the whole list of items? I just want the selected value. How should I be doing this?

Phillipp

Answer 1

You have a view model to which your view is strongly typed => use strongly typed helpers:

<%= Html.DropDownListFor(
    x => x.SelectedAccountId, 
    new SelectList(Model.Accounts, "Value", "Text")
) %>

Also notice that I use a SelectList for the second argument.

And in your controller action you were returning the view model passed as argument and not the one you constructed inside the action which had the Accounts property correctly setup so this could be problematic. I've cleaned it a bit:

public ActionResult AccountTransaction()
{
    var accounts = Services.AccountServices.GetAccounts(false);
    var viewModel = new AccountTransactionView
    {
        Accounts = accounts.Select(a => new SelectListItem
        {
            Text = a.Description,
            Value = a.AccountId.ToString()
        })
    };
    return View(viewModel);
}

Optimist

Thanks @Darin Dimitrov - That worked - but I am not sure what was wrong with my attempt. Can you maybe explain? – Phillipp

@cdotlister, not sure but the problem could have been related to the fact that you were passing the wrong model to your controller action. – Optimist

Thanks. Spotted that just after posting. – Phillipp

I'm trying to reproduce the same code, by using Selected, but i cannot select a default value. The value for Select is clearly = true for one item but it's not shown as selected on the screen. – Anna

Answer 2

Step-1: Your Model class

public class RechargeMobileViewModel
    {
        public string CustomerFullName { get; set; }
        public string TelecomSubscriber { get; set; }
        public int TotalAmount { get; set; }
        public string MobileNumber { get; set; }
        public int Month { get; set; }
        public List<SelectListItem> getAllDaysList { get; set; }

        // Define the list which you have to show in Drop down List
        public List<SelectListItem> getAllWeekDaysList()
        {
            List<SelectListItem> myList = new List<SelectListItem>();
            var data = new[]{
                 new SelectListItem{ Value="1",Text="Monday"},
                 new SelectListItem{ Value="2",Text="Tuesday"},
                 new SelectListItem{ Value="3",Text="Wednesday"},
                 new SelectListItem{ Value="4",Text="Thrusday"},
                 new SelectListItem{ Value="5",Text="Friday"},
                 new SelectListItem{ Value="6",Text="Saturday"},
                 new SelectListItem{ Value="7",Text="Sunday"},
             };
            myList = data.ToList();
            return myList;
        }
}

Step-2: Call this method to fill Drop down in your controller Action

namespace MvcVariousApplication.Controllers
    {
        public class HomeController : Controller
        {
            public ActionResult Index()
            {
              RechargeMobileViewModel objModel = new RechargeMobileViewModel();
                objModel.getAllDaysList = objModel.getAllWeekDaysList();  
                return View(objModel);
            }
    }
    }

Step-3: Fill your Drop-Down List of View as follows

 @model MvcVariousApplication.Models.RechargeMobileViewModel
    @{
        ViewBag.Title = "Contact";
    }
    @Html.LabelFor(model=> model.CustomerFullName)
    @Html.TextBoxFor(model => model.CustomerFullName)

    @Html.LabelFor(model => model.MobileNumber)
    @Html.TextBoxFor(model => model.MobileNumber)

    @Html.LabelFor(model => model.TelecomSubscriber)
    @Html.TextBoxFor(model => model.TelecomSubscriber)

    @Html.LabelFor(model => model.TotalAmount)
    @Html.TextBoxFor(model => model.TotalAmount)

    @Html.LabelFor(model => model.Month)
    @Html.DropDownListFor(model => model.Month, new SelectList(Model.getAllDaysList, "Value", "Text"), "-Select Day-")

Splendent

Mine gives error in cshtml that it can't convert method group to IEnumerable. – Untwine