Introducción

 

La idea de este artículo es mostrar brevemente como se puede modelar información de una base de datos de diferentes formas en los controles ComboBox, DropDownList, GridView, FormView, DetailsView, DataList, Repeater y diferenciar los alcances ventajas y desventajas, para esto debemos primero revisar la carga de los datos en un DataSource.

 

Fuentes de datos

Hoy en día .Net nos ofrece diferentes fuentes de datos que nos permiten modelar la información de forma fácil sin importar la capa de datos que estemos usando aun si no usamos una capa de datos. Estas fuentes de datos pueden ser asignadas a controles que permitan el moldeamiento de datos entre muchas otras cosas. Las diferentes fuentes de datos pueden venir de un DataTable, ArrayList, List ó los objetos gráficos como SqlDataSource, LinqDataSource, XmlDataSource, ObjectDataSource que permiten la utilización de un asistente o wizard para su implementación.

 

DataTable: Es un objeto que se encuentra en el NameSpace System.Data que permite almacenar tablas en memoria, además estos objetos permiten ser agregados a un DataSet o crear relaciones entre DataTable.

Los DataTable una vez creados tienen definido el esquema de la tabla.

//Defiinicion de un DataTable

DataTable dt = new DataTable();

//Definicion de un DataSet

DataSet dts = new DataSet();

//Agregar un DataTable a un DataSet

dts.Tables.Add(dt);

 

//Definicion de un SqlDataAdapter

SqlDataAdapter sqlDataAdapter = new SqlDataAdapter("select * from usuarios", sqlcn);

//Llenado de un DataTable

sqlDataAdapter.Fill(dt);

 

ArrayList: Es un objeto que se encuentra en el NameSpace System.Collections y permite almacenar lista de objetos en cada una de sus posiciones siendo una valor agregado con respecto a los DataTable ya que en este podríamos almacenar los registros de una tabla pero encapsulando información, si es que lo requerimos.

//Definicion de la coleccion de objetos

ArrayList arl = new ArrayList();

Usuario usuario = new Usuario("Juan","Perez");

//Agregar un objeto a la coleccion

arl.Add(usuario);

//Inserta un objetp en una posicion especifica

arl.Insert(5,usuario);

//

if (arl.Contains(usuario))

{

     //Ya se encuentra en la collecion

}

 

List: Es un objeto que se encuentra en el System.Collections.Generic, la clase List es el equivalente genérico de la clase ArrayList. Implementa la interfaz genérica IList. Y además podemos hacer uso de LINQ.

List<Usuario> lstUsuasrios = new List<Usuario>();

lstUsuasrios.Add(usuario);

var Juan = from u in lstUsuasrios where u.Nombre == "Juan" select u;

 

Fuentes de datos  gráficos.

Los objetos gráficos los podemos arrastrar del toolbox y su gran ventaja es que permite la selección de base de datos, tablas y filtros sin necesidad de escribir código.

SqlDataSource: Este objeto esta optimizado para proveedores SQL Server.

Para asignar la fuente de datos hacemos clic en el SmartTag y seleccionamos Configure Data Source

1.       Selección de la cadena de conexión (Puede leerse del web.config o generarla con ayuda de asistente)

 

2.       Si fue generada permite que sea guardada en un archivo de configuración.

 

 

 

3.       Luego permite seleccionar el procedimiento almacenado para realizar el llenado o seleccionar la tabla con sus correspondientes filtros y demás.

4.       Finalmente nos permite realizar una prueba.

 

AccessDataSource: Este objeto funciona con base de datos Access.

Para asignar la fuente de datos hacemos clic en el SmartTag y seleccionamos Configure Data Source

1.       Primero se debe agregar la base de datos Access a la aplicación (existente).

 

 

 

2.       Luego la seleccionamos.

 

3.       Luego permite seleccionar el procedimiento almacenado para realizar el llenado o seleccionar la tabla con sus correspondientes filtros y demás.

 

4.       Finalmente nos permite realizar una prueba.

 

 

XmlDataSource: Usado para fuentes de datos en archivos XML.

Para asignar la fuente de datos hacemos clic en el SmartTag y seleccionamos Configura Data Source

1.       Primero debemos agregar el archivo XML (existente).

 

 

 

2.       Luego la seleccionamos.

De esta forma podemos llenar las fuentes de datos dependiendo del escenario en el que nos encontremos.

 

Controles usados para representar datos en Visual Studio.

Para modelar la información existen diferentes controles que podemos usar dependiendo de las necesidades asignándole una fuente de datos como las mostradas anteriormente.

 

DropDownList: Este control modela la información mostrando un único dato que puede ser una columna o la unió de ellas.

 

El llenado de los  objeto se  puede hacer de dos formas una es por código y la otra es de forma grafica a través de un SMARTAG.

Opción 1:

//Asignacion de fuente de datos (DataTable,List,ArrayList,SqlDataSource, AccessDataSource, LinqDataSource, etc)

DropDownList1.DataSource = lstUsuasrios;

//Referencia al valor seleccionado

DropDownList1.DataValueField="Id";

//Referencia al texto mostrado

DropDownList1.DataTextField = "Nombre";

//Metodo que llena el control con la fuente de datos asignada

DropDownList1.DataBind();

Opcion 2: Seleccionamos el control y hacemos clic en el SmartTag y hacemos clic en seleccionar fuente de datos

Luego seleccionamos la fuente de datos grafica que hayamos creado.

 

GridView: Este control permite modelar los registros en una tabla, incluyendo en algunos campos chekbox, DropDownList1, etc.

El llenado de este objeto es muy sencillo si no requerimos una interface grafica muy personalizada solo debemos seleccionar el control y hacemos clic en el SmartTag y hacemos clic en seleccionar fuente de datos

Luego seleccionamos la fuente de datos grafica que hayamos creado.

 

Los controles FormView, DetailsView, DataList, Repeater permiten editar el HTML que le aplicara a los registros permitiendo modelar la información de forma personalizada.

Algunos de estos controles tienen algunas ventajas frente a los otros como repetir su contenido verticalmente o horizontalmente.

Básicamente la diferencia en estos controles esta en distribución del las áreas que podemos usar.

 

Algunos permiten el uso de un paginador

 

 

Las áreas de estos controles generalmente tienen estas áreas.

Pero difieren de algunos detalles como paginadores, separadores, registros de edición, selección, inserción, o registros vacios entre otros.

Cabe destacar que para cada área podemos asignar una interface HTML o asignar un estilo y asociar un dato del DataSource a la interface.

DataList

Además de las áreas comunes tiene Separator, EditItem y SelectedItem.

Ventajas: Permite modelar varios registros, perite modelar los registros Vertical o horizontal y podemos editar el area que separa un registro del otro.

Desventajas: No tiene paginador, no permite la inserción, edición, y eliminación integrada con la fuente de datos.

 

 

DetailsView

Como su nombre lo indica permite ver un registro en detalle en un solo pantallazo.

Ventajas: Tiene paginador, y permite la personalización de registros para la inserción, edición y eliminación de registros y sus eventos.

Desventajas: Modela un registro a la vez, no permite personalización de campos.

 

FormView

Modela un formulario el cual es mostrado en un pantallazo.

Ventajas: Tiene paginador, y permite la personalización de registros para la inserción, edición y eliminación de registros y sus eventos.

Desventajas: Modela un registro a la vez.

Repeater:

Este control tiene las areas basicas.

Desventajas: No tiene interface para inserción, edición y eliminación ni sus eventos, no tiene paginador.

 

Ejemplo: En el siguiente ejemplo vemos que podemos agregar código HTML en cada una de las áreas y vincular los tag HTML con las fuentes de datos.

Por ejemplo en el Header abrimos una tabla y en cada item por cada registro creamos una fila con una interface grafica y al HyperLink ‘hplItemMenuLateral’ lo vinculamos con el dato ‘Titulo’ proveniente de la fuente de datos.

 

<asp:DataList ID="dtlMenuLateral" runat="server"

    onitemdatabound="dtlMenuLateral_ItemDataBound">

    <HeaderTemplate>

    <table cellpadding="0" cellspacing="0" border="0px">

           

    </HeaderTemplate>

    <ItemStyle />

    <ItemTemplate>

       

   

        <tr id="trMenu" runat="server">

                <td class="menu_item">

                    <asp:HyperLink ID="hplItemMenuLateral" runat="server"

                    Text='<%# DataBinder.Eval(Container.DataItem, "Titulo") %>'

                     NavigateUrl=""></asp:HyperLink>

                   

                </td>

          

         </tr>  

        

 

        </ItemTemplate>

        <FooterTemplate>

               

            </table>

        </FooterTemplate>

</asp:DataList>

Y la asignacion de la fuente de datos podria ser algo de este estilo.

this.dtlMenuLateral.DataSource =dtMenu();

this.dtlMenuLateral.DataKeyField = "Ida";

this.dtlMenuLateral.DataBind();

 

Para no enredar el tema y publicar montones de código HTML el concepto al usar estos controles de forma adecuada miremos los pasos básicos:

·         Primero se debe cargar la fuente de datos.

·         Luego se debe seleccionar el modelo grafico a seguir,  teniendo en cuanta la ventajas y desventajas de cada control.

·         Se debe personalizar el HTML en cada una de las áreas, creando el vínculo a la fuente de datos.