[ASP.NET] Controles enlazados a datos en ASP.NET 4.5

Hola a todos, hoy quiero mostrarles una nueva características que trae ASP.NET 4.5 y es la de realizar binding directamente desde la definición (HTML) del control, en mi opinión una característica bastante cool y que se asemeja a utilizar el patrón MVVM (claro una pequeña aproximación), los que ya han trabajado con WPF o Windows 8 ya les será tema conocido.

Entonces en primer lugar vamos a crear una clase Cliente, con 4 propiedades:

   1:  public class Cliente
   2:  {
   3:      public int ClienteId { get; set; }
   4:      public string Nombre { get; set; }
   5:      public string Apellido { get; set; }
   6:      public string Email { get; set; }
   7:  }

Ahora, para el ejemplos utilizaremos un GridView, y acá viene la primera propiedad nueva, en la definición del Grid vamos a utilizar ItemType, y allí definimos en esta caso la clase Cliente creada…y gracias al querido Visual Studio y su intellisense será muy sencillo:

image

Y ahora vamos para las columnas, en este caso para seguir aprovechando lo nuevo en ASP.NET 4.5 las vamos a definir utilizando TemplateField, y de nuevo tenemos la gran ayuda del intellisense:

image

Bueno y finalmente para el enlace a datos vamos a usar la propiedad SelectMethod, allí debemos colocar el nombre de un método que se encuentre en el code behind de la página, ese método debe ser público, entonces el HTML de GridView finalmente sería:

   1:  <asp:GridView ID="grvClientes" runat="server" AutoGenerateColumns="false" 
   2:      ItemType="Controles_Tipados.model.Cliente" SelectMethod="ObtenerClientes">
   3:      <Columns>
   4:          <asp:TemplateField HeaderText="Cliente Id">
   5:              <ItemTemplate><%# Item.ClienteId %></ItemTemplate>
   6:          </asp:TemplateField>
   7:          <asp:TemplateField HeaderText="Nombre">
   8:              <ItemTemplate><%# Item.Nombre %></ItemTemplate>
   9:          </asp:TemplateField>
  10:          <asp:TemplateField HeaderText="Apellido">
  11:              <ItemTemplate><%# Item.Apellido %></ItemTemplate>
  12:          </asp:TemplateField>
  13:          <asp:TemplateField HeaderText="Email">
  14:              <ItemTemplate><%# Item.Email %></ItemTemplate>
  15:          </asp:TemplateField>
  16:      </Columns>
  17:  </asp:GridView>

Y el code behind de la página:

   1:  private static readonly List<Cliente> clientes = new List<Cliente>(){
   2:      new Cliente { ClienteId = 1, Nombre = "Julio", Apellido = "Avellaneda", Email = "julito_gtu@hotmail.com" },
   3:      new Cliente { ClienteId = 1, Nombre = "Julio", Apellido = "Avellaneda", Email = "julito_gtu@hotmail.com" },
   4:      new Cliente { ClienteId = 1, Nombre = "Julio", Apellido = "Avellaneda", Email = "julito_gtu@hotmail.com" },
   5:      new Cliente { ClienteId = 1, Nombre = "Julio", Apellido = "Avellaneda", Email = "julito_gtu@hotmail.com" },
   6:      new Cliente { ClienteId = 1, Nombre = "Julio", Apellido = "Avellaneda", Email = "julito_gtu@hotmail.com" },
   7:      new Cliente { ClienteId = 1, Nombre = "Julio", Apellido = "Avellaneda", Email = "julito_gtu@hotmail.com" },
   8:      new Cliente { ClienteId = 1, Nombre = "Julio", Apellido = "Avellaneda", Email = "julito_gtu@hotmail.com" }
   9:  };
  10:   
  11:  public List<Cliente> ObtenerClientes()
  12:  {
  13:      return clientes;
  14:  }

En este caso tenemos una lista con datos fijos, pero si se quiere más dinamismo podríamos tener una consulta a base de datos.

Y para profundizar más en el tema: Strongly Typed Data Controls

Espero les haya gustado el post… saludos!

You may also like...

3 Responses

  1. September 25, 2012

    […] [ASP.NET] Controles enlazados a datos en ASP.NET 4.5 […]

  2. October 5, 2012

    […] [ASP.NET] Controles enlazados a datos en ASP.NET 4.5 […]

  3. December 19, 2012

    […] [ASP.NET] Controles enlazados a datos en ASP.NET 4.5 […]

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Follow

Get every new post on this blog delivered to your Inbox.

Join other followers: