Utilizar o HtmlHelper para criar um DropDownList em uma View do ASP.NET MVC pode ser um desafio para iniciantes em MVC, veja como facilitar seu trabalho utilizando uma técnica simples.

Existem diversas formas de popular e controlar o estado de um DropDownList gerado pelo HtmlHelper, algumas podem dar um certo trabalho e confundir o programador que está iniciando com ASP.NET MVC e ainda não dominou todas as técnicas.

Conforme o código a seguir, criamos na pasta Models uma classe chamada Cliente que será utilizada para popular um DropDownList, observe que foi criado um método que retorna uma lista de clientes pré definidos (apenas para facilitar a demonstração).

using System.Collections.Generic;

namespace DropDownList.Models
{
    public class Cliente
    {
        public int ClienteId { get; set; }
        public string Nome { get; set; }

        public List<Cliente> ListaClientes()
        {
            return new List<Cliente>
            {
                new Cliente { ClienteId = 1, Nome = "Eduardo Pires"},
                new Cliente { ClienteId = 2, Nome = "João Silva"},
                new Cliente { ClienteId = 3, Nome = "Fulano de Tal"}
            };
        }
    }
}

A classe de Controller possui dois ActionResults, um para Get e um para Post, no primeiro ActionResult é criada uma ViewBag utilizando um nome que facilite o entendimento (no caso o ClienteId).

Esta ViewBag recebe uma estrutura DropDownList que é criada através da classe SelectList e os parâmetros utilizados são: Source, Value, Name (Origem do dado [Método ListarClientes], valor do elemento e nome a ser exibido). Estes parâmetros precisam coincidir com as propriedades da estrutura do seu dado (classe Cliente).

using System.Web.Mvc;
using DropDownList.Models;

namespace DropDownList.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            // Criando uma ViewBag com uma lista de clientes.
            // Utilizo o nome da ViewBag com ClienteId apenas
            // para facilitar o entendimento do código
            // new SelectList significa retornar uma
            // estrutura de DropDownList
            ViewBag.ClienteId = new SelectList
                (
                    new Cliente().ListaClientes(),
                    "ClienteId",
                    "Nome"
                );

            return View();
        }

        [HttpPost]
        // No Post o valor selecionado do DropDownList
        // será recebido no parametro clienteId
        public ActionResult Index(string clienteId)
        {
            // O quarto parametro "clienteId" diz qual é o ID
            // que deve vir pré-selecionado ao montar o DropDownList
            ViewBag.ClienteId = new SelectList
                (
                    new Cliente().ListaClientes(),
                    "ClienteId",
                    "Nome",
                    clienteId
                );

            return View();
        }
    }
}

Ao observar o retorno da criação do SelectList no Quick Watch fica mais fácil de entender a estrutura retornada

Para o Razor HtmlHelper criar corretamente seu DropDownList basta informar (no formato String) o nome da ViewBag que contém a estrutura de dados, foi adicionado um segundo parâmetro para criar um elemento em branco na primeira posição, assim evitando que o primeiro item seja selecionado por engano.

@{
    ViewBag.Title = "Teste DropDownList";
}

@using (Html.BeginForm("Index", "Home", FormMethod.Post))
{
    @Html.AntiForgeryToken()
    <div>
        <h4>@ViewBag.Title</h4>
    </div>
    <div class="row">
        <div class="col-md-8">
            Escolha o cliente:
            @* Passando o Nome da ViewBag *@
            @Html.DropDownList("ClienteId", String.Empty)

            <input type="submit" value="Enviar" class="btn btn-default" />
        </div>
    </div>
}

O resultado ficará assim

A View possui um Form que fará um post para a segunda ActionResult da Controller que já espera receber o valor do item selecionado no DropDownList, o mesmo processo é repetido só que no final da criação da estrutura da SelectList é repassado mais um parâmetro que é o valor do item que foi selecionado na tela anterior, esse parâmetro garante que o foco da seleção mantenha-se no item que foi previamente selecionado.

Com isso vimos que é muito simples utilizar o DropDownList utilizando esta técnica, caso queira treinar basta criar um projeto simples ASP.NET MVC e implementar o código disponibilizado aqui.

Caso desconheça o uso de ViewBag leia este meu artigo que explica os conceitos:
ASP.Net MVC – ViewData, ViewBag e TempData

Até a próxima! 😉