title: ASP.NET MVC DropDownList value on HttpPost
body: <p>I am following this <a href="http://www.asp.net/mvc/tutorials/javascript/working-with-the-dropdownlist-box-and-jquery/using-the-dropdownlist-helper-with-aspnet-mvc" rel="nofollow">Tutorial on ASP.NET MVC</a>, specifically where it states that providing the String of <code>"MovieType"</code> to the Razor View as follows:<code>@Html.DropDownList("MovieType")</code> will provide the key to <strong>DropDownList</strong> to find a property in the <code>ViewBag</code> of type <code>IEnumerable&lt;SelectListItem&gt;</code>.</p>
  
  <p>That works just fine.</p>
  
  <p>However, I am unable to get the value that the User selects on my method with <code>[HttpPost]</code> attribute.</p>
  
  <p>Here is my code and what I have tried thus far.</p>
  
  <p><strong>Controller</strong></p>
  
  <pre><code>public class ProductController : Controller 
  {
      private readonly ProductRepository repository = new ProductRepository();
  
      // Get: /Product/Create
      public ActionResult Create()
      {
          var categories = repository.FindAllCategories(false);
          var categorySelectListItems = from cat in categories
                                        select new SelectListItem()
                                            {
                                                Text = cat.CategoryName,
                                                Value = cat.Id.ToString()
                                            };
          ViewBag.ListItems = categorySelectListItems;
          return View();
      }
  
      [HttpPost]
      public ActionResult Create(Product product)
      {
          /** The following line is not getting back the selected Category ID **/
          var selectedCategoryId = ViewBag.ListItems;
          repository.SaveProduct(product);
          return RedirectToAction("Index");
      }
  }
  </code></pre>
  
  <p><strong>Razor cshtml View</strong></p>
  
  <pre><code>@model Store.Models.Product
  
  &lt;h2&gt;Create a new Product&lt;/h2&gt;
  
  @using (@Html.BeginForm())
  {
      &lt;p&gt;Product Name:&lt;/p&gt;
      @Html.TextBoxFor(m =&gt; m.ProductName)
  
      &lt;p&gt;Price&lt;/p&gt;
      @Html.TextBoxFor(m =&gt; m.Price)
  
      &lt;p&gt;Quantity&lt;/p&gt;
      @Html.TextBoxFor(m =&gt; m.Quantity)
  
      &lt;p&gt;Category&lt;/p&gt;
      @Html.DropDownList("ListItems")
      &lt;p&gt;&lt;input type="submit" value="Create New Product"/&gt;&lt;/p&gt;
  }
  </code></pre>
  
  <p>I tried playing with the overloads for <code>DropDownList</code>, but I am not able to get the value back that the User is selecting.</p>
  
  <p>If anyone sees what I am missing or has any ideas or suggestions, I would be very grateful.  Thanks!</p>
  
  <p><strong>Update</strong> </p>
  
  <p>Posting <code>Product</code> Model.  Note, this was auto-generated by Entity Framework when I created the .edmx.</p>
  
  <pre><code>namespace Store.Models
  {
      using System;
      using System.Collections.Generic;
  
      public partial class Product
      {
          public long Id { get; set; }
          public string ProductName { get; set; }
          public decimal Price { get; set; }
          public int Quantity { get; set; }
          public System.DateTime DateAdded { get; set; }
          public Nullable&lt;long&gt; CategoryId { get; set; }
  
          public virtual Category Category { get; set; }
      }
  }
  </code></pre>