I'm sure I'm overlooking the obvious here... I'm having trouble binding DropDownList data from a controller to when rendering the form in the partial view... below is a condensed version... have tried numerous way to pass the list data back and bind to the dropdownlist but have not had any luck... many thanks in advance...

----CONTROLLER---

    public class MembershipDirectoryModel
    {
        [Display(Name = "First Name")]
        public string FirstName { get; set; }

        [Display(Name = "Last Name")]
        public string LastName { get; set; }

        [Display(Name = "State")]
        public string State { get; set; }

    }

    public class MembershipDirectorySurfaceController : Umbraco.Web.Mvc.SurfaceController
    {

        [HttpGet]
        [ActionName("MembershipDirectory")]
        public ActionResult MembershipDirectoryGet()
        {

            //populate the states options
            ViewBag.StatesList = GetStatesList("");
            ViewData["StatesList"] = GetStatesList("");
            TempData.Add("StatesList", GetStatesList(""));    

            //return model to partival view
            return PartialView("MembershipDirectory", model);
        }

        [HttpPost]
        [ActionName("MembershipDirectory")]
        public ActionResult MembershipDirectoryPost(MembershipDirectoryModel model)
        {
            TempData["Status"] = "you submitted the form searching for: firstName = " + model.FirstName + " lastName = " + model.LastName + " state = " + model.State;
            return RedirectToCurrentUmbracoPage();
        }

        public List<SelectListItem> GetStatesList(string selectedValue)
        {

          //call to DB to get states options and returns list

        }

---PARTIAL VIEW---

@model ncba.applications.Membership.SurfaceControllers.MembershipDirectoryModel

using (Html.BeginUmbracoForm("MembershipDirectory", "MembershipDirectorySurface", FormMethod.Post, new {@class = "generic-form elements-row"}))
{

  <ul class="elements-horizontal">
  
   <li class="row">
    <div class="form-element">
     <label for="FirstName">First Name</label>
           @Html.TextBoxFor(model => model.FirstName)
    </div>
   </li>
      
   <li class="row">
    <div class="form-element">
     <label for="LastName">Last Name</label>
           @Html.TextBoxFor(model => model.LastName)
    </div>
   </li>

   <li class="row">
    <div class="form-element">     
     <label for="State">State</label>
     @Html.DropDownListFor(model => model.State, (IEnumerable<SelectListItem>)ViewData["StatesList"], "Select a State")
     
    </div>
   </li>
  </ul>

}