Phill Greggan
Phill Greggan

Reputation: 2394

How do i load data to a drop down on view that already bound with a collection?

i have a view that is bound with the IEnumerable<ProductCategoryViewModel> in this view there is a drop down box with the values search type values so i can search a product category by either code or name.

here is the controller:

public ActionResult Index()
{


    List<SelectListItem> list = new List<SelectListItem> { 
        new SelectListItem {Text="By Code", Value="1", Selected=true}, 
        new SelectListItem {Text="By Name", Value="2"}
    };

    var categories = _db.mt_ProductCategories
                        .Select(
                        p => new ProductCategoriesViewModel
                        {
                            Id = p.Id,
                            Name = p.CatName,
                            CatCode = p.CatCode, SearchTypes=list
                        });

    if (Request.IsAjaxRequest())
    {
        return PartialView("_ProductCategoryList", categories);
    }

    return View(categories);

}

here is the ViewModel

public class ProductCategoriesViewModel
{
   public int Id { get; set; }
   public string  CatCode { get; set; }
   public string Name { get; set; }


   public IEnumerable<SelectListItem> SearchTypes { get; set; }
   public string SearchType { get; set; }
}

here is view

    @model IEnumerable<eComm1.Models.ProductCategoriesViewModel>

    @using (Ajax.BeginForm("Search", "ProductCategory",
        new AjaxOptions
        {
            HttpMethod = "POST",
            UpdateTargetId = "prod-grid",
            InsertionMode = InsertionMode.Replace,
            OnSuccess = "loaddivdata"

        }))
    { 
        //i need to put the drop down here but since i passed a collection it does not show the property "SearchType". the code should be like below but errors
@Html.DropDownListFor(m=>m.SearchType, Model.SearchTypes)
    }

How do i access the property SearchType in my current view?

Upvotes: 0

Views: 55

Answers (1)

user3559349
user3559349

Reputation:

You need a view model that has properties for SearchType and SearchType and in the view use a single instance of that view model (and initially generate the list of ProductCategories by calling @Html.Action()).

public class ProductSearchVM
{
  public string searchText { get; set; }
  public string SearchType { get; set; }
  public IEnumerable<SelectListItem> SearchTypes { get; set; }
}

and in the controller

public ActionResult Index()
{
  ProductSearchVM model = new ProductSearchVM
  {
    SearchType = "1", // this is how you set the selected value
    SearchTypes = new List<SelectListItem>
    {
      new SelectListItem { Text = "By Code", Value = "1" }, // no point adding Selected = true; - its ignored by the HtmlHelper
      new SelectListItem { Text = "By Name", Value = "2" }
    }
  };
  return View(model)
}

and in the view

@model ProductSearchVM
@using (Ajax.BeginForm("Search", "ProductCategory", new AjaxOptions { ... }))
{ 
    @Html.DropDownListFor(m => m.SearchType, Model.SearchTypes)
    @Html.TextBoxFor(m => m.searchText)
}
<div id="prod-grid">
  @Html.Action("Search", "ProductCategory") // optionally add new { searchType = "1" }?
</div>

Upvotes: 2

Related Questions