We Keep Coding

.NET 6 - Set SelectListItem to Selected?

I have a DropDownList which I populate like below:
Controller
IEnumerable<Category> categories = _db.Category.ToList();
var selectList = _db.Category.Select(i => new SelectListItem()
{
Text = i.Name,
Value = i.Id.ToString()
});
ViewBag.categoriesSelectList = selectList;
And use in view like so:
<select asp-for="Category" name="categoryID" asp-items="#ViewBag.categoriesSelectList" class="form-control">
<option>Vælg Kategori:</option>
</select>
However, I can't seem to figure out how I can set the already selected value, so the dropdown "starts" on that value. I tried enumerating over the selectList and changing the Selected attribute of the SelectListItem, but it doesn't work since it won't save the changes I make.
Hope my question makes sense :) thanks all.

Option 1:
Modify your code to include Selected property when creating list of SelectListItem items:
var selectList = _db.Category.Select(i => new SelectListItem()
{
Text = i.Name,
Value = i.Id.ToString(),
Selected = /* Some condition that is true when the current item should be selected */
});
Option 2:
Define a view model with structure that might be referenced in the <select> tag:
public class SelectViewModel
{
public string Category { get; set; }
public List<SelectListItem> Categories { get; set; }
}
The action method:
public IActionResult Categories()
{
var model = new SelectViewModel() ;
model.Categories = _db.Category.Select(i => new SelectListItem()
{
Text = i.Name,
Value = i.Id.ToString()
});
model.Category = ... your_code_to_set_default_selection;
return View(model);
}
The view:
#model SelectViewModel
<select asp-for="Category" asp-items="#Model.Categories"></select>
Can find some mode information in the documentation: The Select Tag Helper

Render dropdownlist in MVC

Below is my Controller that outputs a List to Partial view. My Question is how do I render the ActionResult output as a dropdown. ( I do not want to use ViewBag Please )
using System.Web.Mvc;
namespace CMS.Controllers
{
public class ArticleTypeController : Controller
{
// GET: ArticleType
[ChildActionOnly]
public ActionResult Get(int _siteId)
{
using (var ctx = new CMSEntities())
{
List<articleType> listArticleType = CMS.Models.Cms.getArticleTypes(CMS.Models.Cms.getSiteId()).ToList();
List<SelectListItem> items = new List<SelectListItem>();
foreach (var item in listArticleType)
{
items.Add(new SelectListItem { Value = item.id.Value.ToString(), Text = item.name });
}
items.Add(new SelectListItem { Value = "0", Text = "--Select--", Selected=true });
return PartialView(items);
}
}
}
}
View looks like below:
#model List<SelectListItem>
<h2>test</h2>

If you have a model property to which you're trying to bind the selected value, you can pass a lambda expression to indicate the property that you want to bind and the framework will generate the appropriate name:
#Html.DropDownList(m => m.FinancialYearID, MySelectList,
"Select option", new { #class= "foo" ,data-somename="dataName"})
your partial view should have only this dropdown and you can render this partial view any where you want using following Jquery function
renderPartialInDiv("partial view url","div id or class")

How to pass ID to default value of another view

I have a list of incidents which can have associated jobs. I Have a separate views for incidents and jobs. From the incident index page I have the following link to create a new job for that incident:
#Html.ActionLink("Create","Create", "Job", new { id = item.IncidentID }, null)
which takes the incident ID from that field and loads the Job view. I want to pass the ID as a default value for creating a new job, so the job will be assigned the incident ID.
I made this controller:
public ActionResult Create(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
var newid = id;
ViewBag.ActionCode = new SelectList(db.ActionTypes, "ActionCode", "ActionType1");
ViewBag.IncidentID = new SelectList(db.Incidents, "IncidentID", "DefectFreeText");
return View();
}
How can I assign a default value to the form on the create job view ? I thought something like this:
#Html.EditorFor(model => model.IncidentID, id/newid)
Can anyone help me figure out what I am doing wrong?

I am assuming you want to set a default item for your Incidents dropdown list when user pass that to your create action method as a querystring. I would avoid using ViewBag approach to transfer your dropdown list data to the view and switch to a strongly typed viewmodel approach.
First create a viewmodel for our create view.
public class CreateJobVM
{
public int IncidentID { set;get;}
public int ActionTypeID { set;get;}
public List<SelectListItem> ActionTypes { set;get;}
public List<SelectListItem> Incidents{ set;get;}
public CreateJobVM()
{
ActionTypes =new List<SelectListItem>();
Incidents=new List<SelectListItem>();
}
}
And in your GET view,
public ActionResult Create(int? id)
{
var vm=new CreateJobVM();
vm.ActionTypes=GetActionTypes();
vm.Incidents=GetIncidents();
if(id.HasValue)
{
//set the selected item here
vm.IncidentID =id.Value;
}
return View(vm);
}
Assuming GetActionTypes and GetIncidents method returns a list of SelectListItems, From a DB table/ XML /whatever place you have data
public List<SelectListItem> GetActionTypes()
{
List<SelectListItem> actionTypesList = new List<SelectListItem>();
actionTypesList = db.ActionTypes
.Select(s => new SelectListItem { Value = s.ID.ToString(),
Text = s.Name }).ToList();
return actionTypesList;
}
and in your view which is strongly typed to CreateJobVM
#model CreateJobVM
#using(Html.Beginform())
{
#Html.DropDownListFor(s=>s.ActionTypeID ,Model.ActionTypes)
#Html.DropDownListFor(s=>s.IncidentID,Model.Incidents)
<input type="submit" />
}
When you post the form you can check the property values to get the values user selected in the form
[HttpPost]
public ActionResult Create(CreateJobVM model)
{
//check for model.IncidentID, ActionTypeID
// to do : Save and redirect
}

Just pass it with the help of ViewBag/ViewData
ViewBag.DefaultId=id;
return View();
If you have a model based view
YourViewModel.DefaultId=id;
return View(YourViewModel);
In View,
#ViewBag.DefaultId
or with ViewModel
YourViewModel.DefaultId

Set selected value in dropdown list

How do I set the selected value on a drop down list? Here is what I have so far:
#model Web.Models.PostGraduateModels.PlannedSpecialty
#Html.DropDownList("PlannedSpecialtyID")
//controller
[HttpGet]
public PartialViewResult PlannedSpecialty()
{
// Get Planned Specialty ID
var pgtservice = new PgtService();
PostGraduateModels.PlannedSpecialty plannedSpecialty = pgtservice.GetPlannedSpecialtyId();
// Get Data for Planned Specialty DropDown List from SpecialtyLookup
var pgtServ = new PgtService();
var items = pgtServ.GetPlannedSpecialtyDropDownItems();
ViewBag.PlannedSpecialtyId = items;
return PartialView(plannedSpecialty);
}
// service
public IEnumerable<SelectListItem> GetPlannedSpecialtyDropDownItems ()
{
using (var db = Step3Provider.CreateInstance())
{
var specialtyList = db.GetPlannedSpecialtyDdlItems();
return specialtyList;
}
}
// data access
public IEnumerable<SelectListItem> GetPlannedSpecialtyDdlItems()
{
IEnumerable<Specialty> specialties = this._context.Specialties().GetAll();
var selList = new List<SelectListItem>();
foreach (var item in specialties)
{
var tempps = new SelectListItem()
{
Text = item.Description,
Value = item.Id.ToString()
};
selList.Add(tempps);
}
return selList;
}

I would recommend you to avoid using ViewBag/ViewData/ Weekly typed code. Use strongly typed code and it makes it more readable. Do not use the Magic strings/ Magic variables. I would add a collection property to your ViewModel to hold the SelectList items and another property to hold the selected item value.
public class PlannedSpecialty
{
public IEnumerable<SelectListItem> SpecialtyItems { set;get;}
public int SelectedSpeciality { set;get;}
//Other Properties
}
and in your Get action, If you want to set some Item as selected,
public PartialViewResult PlannedSpecialty()
{
var pgtServ = new PgtService();
var vm=new PlannedSpecialty();
vm.SpecialtyItems = pgtServ.GetPlannedSpecialtyDropDownItems();
//just hard coding for demo. you may get the value from some source.
vm.SelectedSpeciality=25;// here you are setting the selected value.
return View(vm);
}
Now in the View, use the Html.DropDownListFor helper method
#Html.DropDownListFor(x=>x.SelectedSpeciality,Model.SpecialtyItems,"select one ")

Use the selected property of the SelectListItem class:
selList.Selected = true;

Second dropdown list selected item does not change in ASP.NET MVC

I'm a bit confused by the behavior of ASP.NET MVC with it not changing the value of a dropdown list after a POST. Can someone explain how to do this.
First of all I have a model that looks like this:
public class Test
{
public int OneID { get; set; }
public IEnumerable<SelectListItem> OneList
{
get
{
yield return new SelectListItem
{
Text = "Red",
Value = "0"
};
yield return new SelectListItem
{
Text = "Green",
Value = "1"
};
yield return new SelectListItem
{
Text = "Blue",
Value = "2"
};
}
}
public int TwoID { get; set; }
public IEnumerable<SelectListItem> TwoList
{
get
{
yield return new SelectListItem
{
Text = "Ruby",
Value = "0"
};
yield return new SelectListItem
{
Text = "Gem",
Value = "1"
};
yield return new SelectListItem
{
Text = "Bronze",
Value = "2"
};
}
}
}
The view has this snippet of code in the body content:
<% using (Html.BeginForm("Index", "Home", FormMethod.Post))
{ %>
<table>
<tr>
<td>
<% =Html.DropDownList("OneID", Model.OneList, new
{ #onchange = "this.form.submit();" })%>
</td>
<td>
<% =Html.DropDownList("TwoID", Model.TwoList)%>
</td>
</tr>
</table>
<% } %>
And the GET and POST actions look like this:
public ActionResult Index()
{
Test test = new Test();
test.OneID = 0;
test.TwoID = 0;
return View(test);
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Index(Test test)
{
test.TwoID = test.OneID;
return View(test);
}
What I'm trying to achieve is to change the selected item in the second drop down to match the first drop down each time the first drop down is changed. So I'm getting the selected value from the first drop down and assigning it to the ID used for the second drop down and then returning the same model. The first drop down is correctly set in the view but not the second one.
Ideas?

The reason this doesn't work the way you expect it is because when the DropDownList helper tries to render the select element it first looks for posted values that match the name which in this case is TwoID and use this value instead of the value in the model. This is the same with a TextBox for example. If you use this helper and in the POST controller action you modify the value of the model it will still show the old value. That's just how helpers work. They bind from POSTed values.
There are two possible workarounds:
Use javascript to synchronize both dropdowns:
#onchange = "document.getElementById('TwoID').value = this.value; this.form.submit();"
BTW this should be done in an unobtrusive way in a separate javascript file:
$(function() {
$('#OneID').change(function() {
$('#TwoID').val($(this).val());
this.form.submit();
});
});
Write your own helper or generate the select manually (less recommended)