Llenar un TreeView de ASP.NET con datos de SQL Server mediante recursividad

La vez pasa subí un artículo sobre recursividad en SQL Server, ahora sin más preámbulo hay que darle uso a eso.

En este primer ejemplo realizaremos una estructura de árbol en ASP.NET y C#, conocida como TreeView. La llenaremos de forma recursiva usando un procedimiento almacenado y con datos de la tabla tm_ubigeo. En este artículo está el código SQL de la base.


Primero creamos nuestro TreeView, al que llamaremos treevUbigeo, por supuesto después de haber creado el sitio Web en Visual Studio 2008 y haber agregado una página llamada sample1_TreeViewRecursivo.aspx (o como ustedes quieran que se llame):

Ahora iremos a la base creada en SQL Server 2005 y creamos el siguiente procedimiento almacenado:

Código:

alter procedure [dbo].[pa_ubigeo_listar]
(
	@tipo varchar(10),
	@param1 int
)
as
begin
	if @tipo = 'nodos'
		begin
			select tm_idubigeo, tm_nomubigeo, dbo.fc_Obtenervalorcomun('tm_tipoubigeo', tm_tipoubigeo) as tipoubigeo
			from tm_ubigeo
				where tm_idubigeosup = @param1
		end
end

El código anterior nos muestra un procedimiento almacenado que recibe dos parámetros, uno para definir el tipo de consulta y el otro para indicar el id de referencia. Consta de una condición, la cual nos mostrará los registros que coincidan según la id de referencia que enviemos.

Ahora procedemos a crear una clase en el App_Code, a la cual llamaremos clsConexion, la cual tendrá este código:

Código:

public class clsConexion
{
    String var_cadenaconexion = (@"server=WINDOWS-1F39AFE\SQLEXPRESS;database=bd_ejemplo_recursivo;integrated security=true");
    SqlConnection var_conexion = new SqlConnection();
    SqlCommand var_comando = new SqlCommand();
    SqlDataAdapter var_adaptador = new SqlDataAdapter();

    public clsConexion()
    {
        
    }

    public void abrirconexion() 
    {
        var_conexion.ConnectionString = var_cadenaconexion; 
        if (var_conexion.State == ConnectionState.Closed) 
            var_conexion.Open(); 
    }

    public void cerrarconexion() 
    {
        if (var_conexion.State == ConnectionState.Open) 
            var_conexion.Close(); 
    }

    public DataSet dtsUbigeoListar(string tipo, int idnodo)
    {
        DataSet var_resultado = new DataSet(); 
        try
        {
            var_comando.CommandText = "pa_ubigeo_listar";
            var_comando.CommandType = CommandType.StoredProcedure; 
            var_comando.Connection = var_conexion;
            var_comando.Parameters.Add("@tipo", SqlDbType.VarChar, 10).Value = tipo; 
            var_comando.Parameters.Add("@param1", SqlDbType.Int).Value = idnodo; 
            var_adaptador.SelectCommand = var_comando; 
            var_adaptador.Fill(var_resultado, "consulta");
            var_comando.Parameters.Clear();
		}
        catch (Exception ex)
        {
            throw ex; 
        }
        return var_resultado;
    }
}

Primero están las variables necesarias para la conexión y ejecución de procedimientos. Los primeros dos métodos (aparte del constructor), son para abrir y cerrar la conexión a la base de datos respectivamente (si no lo has notado de seguro escuchas a Chino y Nacho a todo volumen mientras), y la función dtsUbigeoListar nos servirá para llenar el DataSet, teniendo el mismo número de parámetros del procedimiento almacenado pa_ubigeo_listar.

Nos dirigimos luego a la página Web, donde en su código programaremos el método mostrarNodos que hará la lógica del llenado recursivo del TreeView:

Código:

clsConexion cn = new clsConexion();
private void mostrarNodos(TreeNode pad)
{
	DataSet dts = new DataSet();
	int i = 0;
	dts = cn.dtsUbigeoListar("nodos", Convert.ToInt32(pad.Value));
	for(i = 1; i <= dts.Tables["consulta"].Rows.Count; i++)
	{
		TreeNode nodo = new TreeNode();
		nodo.Text = dts.Tables["consulta"].Rows[i - 1]["tm_nomubigeo"].ToString() + " --- " + dts.Tables["consulta"].Rows[i - 1]["tipoubigeo"].ToString();
		nodo.Value = dts.Tables["consulta"].Rows[i - 1]["tm_idubigeo"].ToString();
		pad.ChildNodes.Add(nodo);
		mostrarNodos(nodo);
	}
}

Este método tiene como único parámetro una variable de tipo TreeNode, cuyos valores cambiarán a cada llamada que se hace en la estructura for de la función, dentro de la cual se declara un nuevo nodo cada vez, y cada nodo creado se llenará de los datos obtenidos del DataSet que cambiarán también a cada llamada del método, y los cuales se añadirán conforme el for siga su curso. Como vemos, se cumple la recursividad al llamarse a la misma función dentro del for.

Al programar el siguiente código en el evento Page_Load de la página, se logrará el llenado del TreeView:

Código:

protected void Page_Load(object sender, EventArgs e)
{
	TreeNode nodo = new TreeNode();
	this.treevUbigeo.Nodes.Clear();
	nodo.Value = "0";
	nodo.Text = "Ubigeo";
	treevUbigeo.Nodes.Add(nodo);
	cn.abrirconexion();
	mostrarNodos(nodo);
	cn.cerrarconexion();
}

Primero creamos un nodo nuevo, el cual agregaremos con datos iniciales, el valor 0 en su propiedad Value es muy importante dada la naturaleza de la función. El valor Text puede tener cualquier valor que busques, yo le puse “Ubigeo”.

Añadimos el nuevo nodo, y abrimos conexión para dar paso a la ejecución del método anteriormente mencionado, y cerramos conexión. Es muy tedioso poner el abrir y cerrar conexión dentro del método mostrarNodos, ya que hacemos que el proceso sea lento porque se abrirá y se cerrará conexión cada vez que el método sea ejecutado. De esta manera es mejor y más productivo.

Ahora ejecutamos la página y vemos resultados:

Como ven resulta bastante útil el uso de la recursividad para llenar este tipo de estructuras, ya que se hace de una manera rápida, fácil y sencilla (bueno sencillo a mi modo de ver jeje).
Bueno pendejos este fue el primer ejemplo, habrán otros dos más que de seguro les van a ser muy útiles. Nos vemos.

"Tu religión apesta" será el título de un próximo artículo que subiré ¿Tienes algo que decir al respecto? ¿Dudas sobre el ejemplo? ¿Sugerencias? Escríbeme a lovelessisma@gmail.com.

Descargar