22 de enero de 2013

ASP.NET MVC Helper. Html.DropDownListFor con Enumeración (enum)

 

El objetivo de este pequeño post es ver como mostrar un combo box en ASP.NET MVC que se llena desde un enumerado (enum).

El enumerado que usaremos en nuestro ejemplo es el siguiente:

public enum ResultsOrderBy

{

       [Description("Precio")]

       PrecioMenorPrimero,

 

       [Description("Solo en stock")]

       SoloEnStock,

 

       [Description("Más vendidos")]

       MasVendidos

}

Además asumiremos que el modelo usado por la vista tiene una propiedad llamada (OrderBy) que es del tipo (ResultsOrderBy).

Para lograr nuestro objetivo usaremos el helper (Html.DropDownListFor) con dos variantes:

  1. La primera y más sencilla mostrará los valores del enumerado (enum).
  2. La segunda variante, un poco más lograda, mostrará el valor del atributo “Description” de cada uno de los valores del enumerado (enum).

Ver imagen:

Captura1Captura2

 

@Html.DropDownListFor. Variante 1:

Esta variante es muy simple de usar, basta con usar el método Enum.GetValues.

@Html.DropDownListFor(m => m.OrderBy,

    new SelectList(Enum.GetValues(typeof(ResultsOrderBy))),

    new { id = "cmbOrderBy" })

La desventaja de usar esta variante es que nos muestra los valores del enumerado (enum) y no su descripción (ver imagen anterior resaltada en amarillo)

 

 

@Html.DropDownListFor. Variante 2:

Esta variante es un`poco mas compleja y tendremos que hacer uso de algunos métodos extensores implementados por nosotros. Veamos primero el uso del (@Html.DropDownListFor) y posteriormente veremos los métodos necesarios.

@Html.DropDownListFor(m => m.OrderBy,

    (SelectList)(typeof(ResultsOrderBy).GetSelectList()),

    new { id = "cmbOrderBy" })

En esta variante vemos que hacemos uso del método extensor (GetSelectList) que a su ves usa (GetKeyValueList), además necesitaremos una clase muy sencilla (KeyValue) veamos sus implementaciones:

public partial class KeyValue

{

       public KeyValue(){}

       public KeyValue(string key, string value)

       {

             Key = key;

             Value = value;

       }

 

       public string Key { get; set; }

       public string Value { get; set; }

}

El método GetSelectList:

public static SelectList GetSelectList(this Type enumType)

{

       var result = new SelectList(enumType.GetKeyValueList(), "Key", "Value");

       return result;

}

El método GetKeyValueList:

public static IList<KeyValue> GetKeyValueList(this Type enumType)

{

       var arrValores = Enum.GetValues(enumType);

       var lstEnumDescripcion = new List<KeyValue>();

 

       foreach (var valor in arrValores)

       {

             FieldInfo fieldInfo = enumType.GetField(valor.ToString());

             var attribs = fieldInfo

                    .GetCustomAttributes(typeof(DescriptionAttribute), false)

                    as DescriptionAttribute[];

 

             var descripcion = (attribs == null || attribs.Length == 0) ?

                    valor.ToString() :

                    attribs[0].Description;

 

             lstEnumDescripcion.Add(

                    new KeyValue(valor.GetHashCode().ToString(), descripcion));

       }

 

       return lstEnumDescripcion;

}

Y listo… espero les sea de utilidad.

2 comentarios:

  1. Hola Derbis, muy bueno tu tutorial MVC.
    La pregunta es la siguiente.
    Si quiero enlazar un dropdownlist a una consulta personalida SQL, como lo hago?
    Gracias

    ResponderEliminar
  2. Que bueno que hiciste el tutorial me ayudo mucho con mi proyecto

    ResponderEliminar