Using Html.DropDownList over a SelectList - asp.net-mvc-4

Question

I have the following code inside my model class :-
public class PageOptions
{
public PageOptions()
{
int size = Int32.Parse(System.Web.Configuration.WebConfigurationManager.AppSettings["TechPageSize"]);
NameSelectionOptions = new SelectList(
new List<SelectListItem> {
new SelectListItem { Text=size.ToString(), Value = size.ToString()},
new SelectListItem { Text="50", Value = "50"},
new SelectListItem { Text="100", Value = "100"},
new SelectListItem { Text="200", Value = "200"},
new SelectListItem { Text="500", Value = "500"}
}, "Value", "Text");
}
public SelectList NameSelectionOptions { get; set; }
}
}
but how i can display the SelectList inside a Html.DropDownList ? and setting the default valueto be size?
Thanks

Answer 1

You simply pass the desired selection as a 4th parameter to the SelectList constructor:
NameSelectionOptions = new SelectList(
new List<SelectListItem> {
new SelectListItem { Text=size.ToString(), Value = size.ToString()},
new SelectListItem { Text="50", Value = "50"},
new SelectListItem { Text="100", Value = "100"},
new SelectListItem { Text="200", Value = "200"},
new SelectListItem { Text="500", Value = "500"}
}, "Value", "Text", size); // <<< Add size here
This is far more flexible than selecting a specific item in the list.
There are several options for binding a list to the view. You can use a property in the ViewModel, however standard practice (as per Microsoft's scaffolding templates) is to pass dropdown lists to a view in a ViewBag entry of the same name as the Model property. This has the added bonus of automatically binding the simpler #Html.DropDownList("Size") version to both a Model property called Size and the list in ViewBag.Size.
e.g.
In Controller:
ViewBag.Size = new SelectList(
new List<SelectListItem> {
new SelectListItem { Text=size.ToString(), Value = size.ToString()},
new SelectListItem { Text="50", Value = "50"},
new SelectListItem { Text="100", Value = "100"},
new SelectListItem { Text="200", Value = "200"},
new SelectListItem { Text="500", Value = "500"}
}, "Value", "Text", size); // <<< Add size here
viewModel.Size = size;
return View(viewModel);
Where viewModel contains any properties you want edited (including Size).
In View:
#Html.DropDownList("Size")
or if you prefer the strongly typed version.
#Html.DropDownListFor(m=>m.Size, (SelectList)ViewBag.Size)
In any case the consistent naming will help avoid problems.
Default values can go in the ViewBag, but the selection should be bound to your ViewModel so you can use the same ViewModel to receive the posted back values.
#Html.DropDownListFor(m=>m.Size, (SelectList)ViewBag.Size, ViewBag.DefaultSize)
Update:
If you do not wish to bind the current value to anything (as per comment), you simply need to have the ViewBag.Size set to you SelectList by the controller and have this is the View. You do not need a value in the Model.
#Html.DropDownList("Size")
The default selection will be the selection (4th parameter, size) in new SelectList() above.

Answer 2

Simply add Selected property in it:
new SelectListItem { Text=size.ToString(),
Value = size.ToString(),
Selected = true}
Model:
public class PageOptions
{
public PageOptions()
{
int size = Int32.Parse("20");
NameSelectionOptions = new SelectList(
new List<SelectListItem> {
new SelectListItem { Text=size.ToString(), Value = size.ToString()},
new SelectListItem { Text="50", Value = "50"},
new SelectListItem { Text="100", Value = "100"},
new SelectListItem { Text="200", Value = "200"},
new SelectListItem { Text="500", Value = "500"}
}, "Value", "Text");
}
public SelectList NameSelectionOptions { get; set; }
public string SelectedValue { get; set; }
}
Action:
public ActionResult Index()
{
PageOptions model = new PageOptions();
return View(model);
}
Strongly Typed View:
#model TestAjaxUpload.Models.PageOptions
#{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Index</h2>
#Html.DropDownListFor(x=>x.SelectedValue,Model.NameSelectionOptions)
if you want to do without changing your current model for view then, create instance inside view and pass like this:
#model SomeModelClass
#{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Index</h2>
#{
TestAjaxUpload.Models.PageOptions objModel = new TestAjaxUpload.Models.PageOptions();
}
#Html.DropDownListFor(x=>x.SelectedValue,objModel.NameSelectionOptions)
but you should add PageOptions SelectList as property in your Model and use it, i don't recommend to do directly in View.
Update (Using ViewBag):
with ViewBag you can do this way:
public ActionResult Index()
{
PageOptions model = new PageOptions();
ViewBag.List = model.NameSelectionOptions;
ViewBag.Selected = "20";
return View(model);
}
in View:
#Html.DropDownListFor(x=>x.SelectedValue,ViewBag.List as SelectList,ViewBag.Selected as string)