Dropdownlist validation in ASP.Net MVC

Question

I’m having trouble validating my dropdown in a view. In my template I use an Annotation Required as shown in the code below:

Model

[Required(ErrorMessage="Informe uma cidade")]
[Display(Name="Cidade")]
public int CidadeID { get; set; }

View

 @Html.LabelFor(model => model.CidadeID, "CidadeID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("CidadeID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.CidadeID, "", new { @class = "text-danger" })
        </div>

However validation is not performed for the dropdown. How can I resolve this?

Answer 1

If you put a OptionLabel in his DropDownList it will work (in case, the "Select" in the example below).

You can follow this example:

@using (Html.BeginForm())
{
    <strong>@Html.LabelFor(e => e.CidadeId):</strong>
    <div>
        @Html.DropDownListFor(e => e.CidadeId, ViewBag.Cidades as IEnumerable<SelectListItem>, "Selecione")
        @Html.ValidationMessageFor(e => e.CidadeId)
    </div>
    <button type="submit">Enviar</button>
}

Implementation of Viewbag

ViewBag.Cidades = new List<SelectListItem>
{
    new SelectListItem { Text = "Cidade 1", Value="1"},
    new SelectListItem { Text = "Cidade 2", Value="2"},
    new SelectListItem { Text = "Cidade 3", Value="3"},
    new SelectListItem { Text = "Cidade 4", Value="4"},
    new SelectListItem { Text = "Cidade 5", Value="5"}
};

Then you just adapt to your reality.

Answer 2

Try @required in class attributes.

@Html.DropDownList("CidadeID", null, htmlAttributes: new { @required = "required", @class = "form-control" })

Answer 3

Just to illustrate how to display the message, made these two examples based on your code, where by clicking the button and do the Post without selecting an option, the screen displays the error message:

Example with Viewbag:

Model:

public class SeuModel
{
    [Required(ErrorMessage = "Informe uma cidade")]
    [Display(Name = "Cidade")]
    public int CidadeID { get; set; }
}

Controller:

        public ActionResult DropDown()
        {
            var model = new SeuModel();

            ViewBag.Cidades = new List<SelectListItem>
            {
                new SelectListItem { Text = "Selecione", Value="", Selected = true},
                new SelectListItem { Text = "Cidade 1", Value="1"},
                new SelectListItem { Text = "Cidade 2", Value="2"},
                new SelectListItem { Text = "Cidade 3", Value="3"},
                new SelectListItem { Text = "Cidade 4", Value="4"},
                new SelectListItem { Text = "Cidade 5", Value="5"}
            };

            return View(model);
        }

        [HttpPost]
        public ActionResult DropDown(SeuModel model)
        {
            if (ModelState.IsValid)
            {
                //Faça o processamento desejado dos dados
                return View(model);
            }

            //Porém se a propriedade IsValid do ModelState não estiver válida você terá que retornar a View com os dados. 
            //Então, verá a mensagem de validação quando a tela for renderizada.
            ViewBag.Cidades = new List<SelectListItem>
            {
                new SelectListItem { Text = "Selecione", Value="", Selected = true},
                new SelectListItem { Text = "Cidade 1", Value="1"},
                new SelectListItem { Text = "Cidade 2", Value="2"},
                new SelectListItem { Text = "Cidade 3", Value="3"},
                new SelectListItem { Text = "Cidade 4", Value="4"},
                new SelectListItem { Text = "Cidade 5", Value="5"}
            };

            return View(model);
        }

View:

@model SuaAplicacao.Models.SeuModel

<h2>Sua página</h2>

@using (Html.BeginForm())
{

    @Html.LabelFor(model => model.CidadeID, "CidadeID", htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownListFor(e => e.CidadeID, ViewBag.Cidades as IEnumerable<SelectListItem>, "Selecione")
        @Html.ValidationMessageFor(e => e.CidadeID)
    </div>

    <input type="submit" value="Enviar"/>
}

Example with Viewmodel:

Model: I created a Viewmodel called Seumodel. It is a class that will be used to get screen data, much better than working with Viewbags.

        public class SeuModel
        {
            [Required(ErrorMessage = "Informe uma cidade")]
            [Display(Name = "Cidade")]
            public int CidadeID { get; set; } // Essa propriedade recebe o valor do item selecionado, se não vier valor a mensagem será exibida


            public List<SelectListItem> Cidades { get; set; } // Essa propriedade contém a lista dos itens

            public void PreencherListaCidades() // Esse método é para criar/recriar sua lista
            {
                Cidades = new List<SelectListItem>
                {
                    new SelectListItem { Text = "Selecione", Value="", Selected = true},
                    new SelectListItem { Text = "Cidade 1", Value="1"},
                    new SelectListItem { Text = "Cidade 2", Value="2"},
                    new SelectListItem { Text = "Cidade 3", Value="3"},
                    new SelectListItem { Text = "Cidade 4", Value="4"},
                    new SelectListItem { Text = "Cidade 5", Value="5"}
                };
            }        
        }

Controller:

    public ActionResult DropDown()
    {
        var model = new SeuModel();
        model.PreencherListaCidades();
        return View(model);
    }

    [HttpPost]
    public ActionResult DropDown(SeuModel model)
    {
        if (ModelState.IsValid)
        {
            //Faça o processamento desejado dos dados
            return View(model);
        }

        //Porém se a propriedade IsValid do ModelState não estiver válida você terá que retornar a View com os dados. 
        //Então, verá a mensagem de validação quando a tela for renderizada.
        model.PreencherListaCidades();
        return View(model);
    }

View: With Seumodel View you access the necessary properties and render the controls

@model SuaAplicacao.Models.SeuModel

<h2>Sua Página</h2>

@using (Html.BeginForm())
{

    @Html.LabelFor(model => model.CidadeID, "CidadeID", htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownListFor(model => model.CidadeID, Model.Cidades)
        @Html.ValidationMessageFor(model => model.CidadeID)
    </div>

    <input type="submit" value="Enviar"/>
}