
En este artículo voy a explicar cómo crear y llenar dinámicamente (mediante programación) un DataTable y posteriormente enlazarlo a un GridView para mostrar la información con ASP.NET.
En primer lugar tienes que crear un objeto DataTable y su esquema (estructura de tablas y columnas) se define mediante programación. Una vez que se definen las columnas, se añaden filas (registros) a la DataTable generado dinámicamente.
Una vez que el DataTable está lleno con los registros, se enlaza a un control GridView ASP.Net.
Código HTML
El código HTML se compone de un ASP.Net GridView con tres columnas. Estas columnas las debe tener el DataTable generado dinámicamente.
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="DataTable_Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <form id="form1" runat="server"> <div> <asp:GridView ID="GridView1" HeaderStyle-BackColor="#3AC0F2" HeaderStyle-ForeColor="White" runat="server" AutoGenerateColumns="false"> <Columns> <asp:BoundField DataField="Id" HeaderText="Id" ItemStyle-Width="30" /> <asp:BoundField DataField="Nombre" HeaderText="Nombre" ItemStyle-Width="150" /> <asp:BoundField DataField="Ciudad" HeaderText="Ciudad" ItemStyle-Width="150" /> </Columns> </asp:GridView> </div> </form> </body> </html>
Crear dinámicamente DataTable y enlazarlo al GridView en ASP.Net
En el evento donde se carga de página “Page_Load” hay crear una nueva instancia de DataTable. Entonces añadimos las tres columnas a la colección Columns DataTable utilizando el AddRange método de la DataTable.
El método AddRange es una buena manera de reemplazar la tradicional forma de añadir una columna a la vez mediante el método Add. En el método AddRange tenemos que pasar un array de objetos de tipo DataColumn.
Y tenemos que especificar el nombre y el tipo de datos es decir, el tipo de datos que tendrá la columna.
Una vez que el esquema está listo es decir, se definen todas las columnas, podemos añadir filas a DataTable dinámicamente y enlazarlo al control ASP.Net GridView.
Te pongo el código fuente en VB.NET y C#, para que escojas con el que más te acomodes
VB.NET
Imports System.Data Partial Class DataTable_Default Inherits System.Web.UI.Page Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load If Not Me.IsPostBack Then Dim dt As New DataTable() dt.Columns.AddRange(New DataColumn() {New DataColumn("Id", GetType(Integer)), _ New DataColumn("Nombre", GetType(String)), _ New DataColumn("Ciudad", GetType(String))}) dt.Rows.Add(1, "Jonathan Orozco", "Monterrey") dt.Rows.Add(2, "Jesus Corona", "México") dt.Rows.Add(3, "Cirilo Zaucedo", "Tijuana") dt.Rows.Add(4, "Humberto Suazo", "Chile") GridView1.DataSource = dt GridView1.DataBind() End If End Sub End Class
C#
using System.Data; protected void Page_Load(object sender, EventArgs e) { if (!this.IsPostBack) { DataTable dt = new DataTable(); dt.Columns.AddRange(new DataColumn[3] { new DataColumn("Id", typeof(int)), new DataColumn("Name", typeof(string)), new DataColumn("Country",typeof(string)) }); dt.Rows.Add(1, "Jonathan Orozco", "Monterrey"); dt.Rows.Add(2, "Jesus Corona", "México"); dt.Rows.Add(3, "Cirilo Zaucedo", "Tijuana"); dt.Rows.Add(4, "Humberto Suazo", "Chile"); GridView1.DataSource = dt; GridView1.DataBind(); } }