how to build a dropdownlistfor in asp mvc4 from a db inside a partial view

Question

while ive build mvc projects i havent done them in asp.net mvc4.5
so pls forgive me if this question seems really obvious to answer
or if im making obvious noob mistakes
pls feel free to correct all issues...

ive actually been googling all weekend and i seem to get bits of answers
but havent been able to pull it all together

so as the title says im trying to build a simple dropdownlistfor
where the data is pulled from the db
to add another layer of complexity
this DDLF is in a partial view

so heres what ive got

model:

using System.ComponentModel.DataAnnotations.Schema;
using System.Data.Entity;
using System.Globalization;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Security;

namespace proj.Models
{
public class chartType
{
    public int id { get; set; }

    [Required]
    public string typename { get; set; }
}

public class chartTypeVM
{
    [Display(Name = "selectedID")]
    public int selectedChartType { get; set; }

    public IEnumerable<SelectListItem> List { get; set; }
}
}

controller:

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

using proj.Models;

namespace proj.Controllers
{
public class HomeController : Controller
{
    orojDB db = new orojDB ();

    public ActionResult Index()
    {
        chartTypeVM model = initialiseSM();            

        return View(model);
    }

    private chartTypeVM initialiseSM()
    {

        // make scenario DDL
        // using chartTypes for now
        var q = db.chartTypes
            .Select(ct=> new {
                ct.id,
                ct.typename
            })
            .AsEnumerable()
            .Select(ct => new SelectListItem {
                Value = ct.id.ToString(),
                Text = ct.typename
            });

        var cts = new chartTypeVM{
            List = q.AsEnumerable()
        };
        cts.selectedChartType = 1;

        Debug.WriteLine("asdfasdf");

        return cts;
    }
}
}

view:

@using proj.Models
@model chartTypeVM

<h3>We suggest the following:</h3>

@* *************** sections *************** *@
@section sm {
        <div id="sm">
            <section class="content-wrapper sm-content">
                @Html.Partial("_smPartial", Model)
            </section>
            <div class="smCloseD"><img src="/Images/closeArrow.png" alt="Open Scenario Manager" /></div>
            <div class="clear"></div>
        </div>
}

main layout (most of it not shown) :

@using proj.Models
@model chartTypeVM

            <section class="content-wrapper main-content">
                @RenderBody()
            </section>

        @RenderSection("sm",false);

and finally the partial:

@using proj.Models

@model chartTypeVM
<section class="smVars">
<div class="varLabel">Scenario:</div>
<div class="varInput">@Html.DropDownListFor( model=>model.selectedChartType, (SelectList)model.List)</div>
</section>

with the things ive tried
i getting errs like:
- The name 'model' does not exist in the current context
- or the one about not being able to use dynamic variables
- or something being inferred

anyways if you could help id be very grateful
=:-)
thanks!

Answer 1

In order to use DropDownListFor helper your view needs to be strongly typed to a model. In your case that would be the chartTypeVM class. So add a @model directive to the top of your partial view indicating the view model being used:

@model chartTypeVM
<section class="smVars">
    <div class="varLabel">Scenario:</div>
    <div class="varInput">
        @Html.DropDownListFor(model => model.selectedChartType, (SelectList)Model.List)
    </div>
</section>