Validation for dropdown list in MVC - asp.net-mvc

Question

I am new to MVC and I am still trying to explore stuffs inside MVC. Now I came to place where I need to implement validation for drop-down list.
I spent fair amount of time searching for validation in MVC. But I dint get any result which suits to my problem. Please bear in mind that I am new to MVC so correct me if I my approach is wrong for implementing validation.
I created model class like this :
public class ValidationModel
{
[Required(ErrorMessage = "Please select atleast one option")]
public string dropdown { get; set; }
}
And In my controller I am using this code :
#using (Html.BeginForm("selectIndex", "Home", FormMethod.Post))
{
<select name ="dropdwnMode" id="dropdwnMode" class="textbox">
<option selected="selected" value="">Select Mode
#Html.ValidationMessageFor(Model => Model.dropdown) </option>
<option value="1"> Add or Update Customer </option>
<option value="2">Update Customer Credit</option>
</select>
}
Here what I want is when my drop-down list is in Select Mode that is default, it should show please select at least one option error and if user selects 1st or 2nd option then this error message should not display.
But Now it is not displaying any message if I use above approach. So can someone guide me in achieving this?

Answer 1

I would recommend replacing your "Dropdown" property on the model with two properties - one that would hold the selected value and one that would hold all possible values. Then you can use an HTML helper (Razor syntax) to create your dropdown in the view, and MVC would take care of the validation.
Model:
public class ValidationModel
{
/// <summary>
/// ID of the selected option
/// </summary>
[Required(ErrorMessage = "Please select at least one option")]
public int SelectedOptionID { get; set; }
/// <summary>
/// Possible values for the dropdown
/// </summary>
public IEnumerable<OptionModel> Options { get; set; }
}
OptionModel:
public class OptionModel
{
/// <summary>
/// ID (key that uniquely identifies this option)
/// </summary>
public int ID { get; set; }
/// <summary>
/// Name (value or display text that will be shown in the UI)
/// </summary>
public string Name { get; set; }
}
You could also store other properties on the option model if needed. Alternatively, you could use a key-value-pair or dictionary instead of the option model to avoid creating a class, which would be faster but less clear.
View:
#model ValidationModel
#using (Html.BeginForm("selectIndex", "Home", FormMethod.Post))
{
#Html.ValidationMessageFor(Model => Model.SelectedOptionID)
#Html.DropDownListFor(m => m.SelectedOptionID,
new SelectList(Model.Options, "ID", "Name"),
"Select an option") // Default text before the user has selected an option
}
You could name Options and SelectedOptionID a bit better to clarify their usage depending on your implementation.
With this implementation you would (and should) populate the options list from your controller. The selected option would be populated when the user selects an option. Like this:
Controller:
public ActionResult YourAction()
{
ValidationModel model = new ValidationModel();
model.Options = new List<OptionModel> {
new OptionModel { ID = 1, Value = "Add or Update Customer" },
new OptionModel { ID = 2, Value = "Update Customer Credit" }
}
return View("YourViewName", model);
}
As a side note, I would recommend naming your ValidationModel after what the view that uses it is doing (e.g. HomepageModel if your view is the entire homepage or NavigationFormModel if your view is just a partial view that contains a dropdown for navigation).