martes, 31 de julio de 2007

Navega tu sitio con siteMapPath

Vamos a ver un ejemplo de como agregar navegación simplificada a través de diferentes secciones de nuestro sitio sin importar la estructura de directorios del mismo.

Siguiendo con la idea de utilizar nuestra aplicación base de ejemplo, vamos suponer que tenemos una sección de inscripciones de alumnos y que vamos a mostrar en determinadas páginas de nuestro sitio el camino que recorre la aplicación (Inicio > Alumnos > Inscripciones).

Para ello ASP.NET nos provee de elementos que nos hacen la vida muy facil. Para nuestro ejemplo vamos a utilizar 3 elementos:

- <asp:SiteMapDataSource/>
- <asp:SiteMapPath/>
- Archivo Site Map (xml)

Como se trata de código que nos gustaría utilizar en diferentes páginas de nuestro sitio, vamos a crear un web user control y vamos a agregarle los dos primeros elementos que mencionamos. El código sería algo como lo siguiente:
<%@ Control Language="C#" AutoEventWireup="true"
CodeFile="siteNavigation.ascx.cs" Inherits="commonControls_siteNavigation" %>

<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
<asp:SiteMapPath ID="SiteMapPath1" runat="server"/>
Luego necesitamos crear el archivo web.siteMap.xml. Esto es tan simple como hacer click derecho en la aplicación > Add Item y seleccionar Site Map de las opciones en Visual Studio o bien agregar un archivo xml y nombrarlo web.siteMap.xml.

La estructura de este archivo es como el ejemplo que sigue. Note que todos los archivos están en el directorio raiz de mi aplicación pero a través de los nodos siteMapNode puedo lograr la creación de secciones lógicas de acuerdo a mis necesidades.
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="~\inicio.aspx" title="Inicio" description="">
<siteMapNode url="~\alumnos.aspx" title="Alumnos" description="">
<siteMapNode url="~\alumnoInscripcion.aspx"
title="Inscripciones" description="" />
</siteMapNode>
</siteMapNode>
</siteMap>
Por último incluimos el web user control que creamos antes en las páginas que necesitamos que se muestre el path de la aplicación. Por ejemplo en nuestra página alumnoInscripcion.aspx:
<%@ Page Language="C#" MasterPageFile="~/MasterPage.master"
AutoEventWireup="true"
CodeFile="alumnoInscripcion.aspx.cs" Inherits="alumnoInscripcion"
Title="Untitled Page" %>

<%@ Register Src="~/commonControls/siteNavigation.ascx"
TagName="siteNavigation" TagPrefix= "uc1" %>


<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<uc1:siteNavigation ID="siteNavigation1" runat="server" />
</asp:Content>
Esto es todo lo que necesitamos; compilamos y ejecutamos la aplicacion y si vamos a nuestra página alumnoInscripcion.aspx veremos algo parecido a la siguiente imagen. Espero que les haya sido útil, no dejen de participar dejando comentarios.

lunes, 30 de julio de 2007

Dando formato a código C# y HTML

Una de las necesidades que surgen a partir de la decisión de comenzar un blog o sitio web que involucra tecnologías de desarrollo es la de ofrecer a tus lectores code snippets o porciones de código tanto HTML como C#.

Uno de los add-ins que he utilizado es CopySourceAsHTML. Pueden leer un artículo que he escrito en la siguiente url: http://www.ide-plugins.com.ar/visual-studio-add-ins/visual-studio-.net-2005/copysourceashtml.html

Esta extensión para Visual Studio funciona muy bien y me ha resultado muy util en otros sitios web y herramientas CMS (DNN, Joomla, etc), pero en lo que respecta a Blogger, no genera el código de forma óptima por lo cual he necesitado cambiarlo por uno que me recomendó mi amigo Martin Olivares Pick.

Se trata de un formateador online que podemos encontrar en: http://www.manoli.net/csharpformat/
Funciona mucho mejor con Blogger y es muy simple de utilizar, por lo tanto lo recomiendo ampliamente.

Gracias Martin!!!

jueves, 19 de julio de 2007

ASP.NET AJAX Toolkit: Download e Instalación

Una de las características principales de un desarrollo WEB 2.0 radica en la utilización de la tecnología AJAX. Microsoft nos provee de las herramientas necesarias para el desarrollo de aplicaciones con esta tecnología. Estas herramientas son las siguientes: las ASP.NET 2.0 AJAX Extensions 1.0 y el ASP.NET AJAX Control Toolkit. Vamos a ver en este primer contacto como conseguir estas herramientas, instalarlas en nuestro sistema y configurarlas en nuestro entorno de desarrollo.

- Download e Instalación
Para realizar el download de estas herramientas, apuntamos nuestro navegador favorito a la siguiente dirección: http://www.asp.net/ajax/downloads/;
aqui tenemos dos links para realizar el download de estas herramientas.

En el paso 1 vamos a hacer click en el link que muestra la figura para realizar el download de las ASP.NET Extensions v1.0. Este link nos direcciona una página del sitio web de Microsoft.

Una vez hecho el download procedemos a la instalación. El proceso de instalación es bastante estandar y no merece comentarios adicionales. La ruta donde se instalarán las extensiones es: C:\Archivos de programa\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025

Luego repetimos el proceso para el paso 2 hacieno click en el botón Download the Control Toolkit. En este caso, accederemos a una página en el sitio de CodePlex. Aqui podremos descargar tanto el Toolkit incluyendo el código fuente. En nuestro primer contacto, solo necesitamos el Toolkit sin incluir el código, el cual es evidentemente un download de menor tamaño. Hacemos click en AjaxControlToolkit-NoSource.zip y lo descomprimimos en algún lugar de nuestro disco. En lo personal prefiero mantener cierto orden para esta instalación para lo cual descomprimo este archivo en la siguiente ruta: C:\Archivos de programa\Microsoft ASP.NET\ASP.NET AJAX Control Toolkit\.



- Configuración del entorno
Una vez realizados los pasos anteriores (Downloads de los dos archivos e instalación de las ASP.NET Extensions -este es un paso requerido por el Toolkit-). Abrimos Visual Studio y creamos un nuevo sitio web eligiendo "AJAX Control Toolkit Web Site" an la sección My Templates.

Aquí vamos a agregar un tab en nuestro Toolbox para poder utilizar los controles provistos por el Toolkit. Para ello hacemos click derecho debajo del tab General y elegimos "Add Tab"; le ponemos un nombre como AJAX Toolkit; dentro de este nuevo tab hacemos click derecho y seleccionamos la opción "Choose Items...", un cuadro de diáologo aparece y hacemos click en "Browse..." y buscamos la carpeta bin del sitio de ejemplo en el path de la instalación de las AJAX Toolkit. Par nuestro caso la ruta completa es C:\Archivos de programa\Microsoft ASP.NET\ASP.NET AJAX Control Toolkit\SampleWebSite\Bin; alli seleccionamos el archivo AjaxControlToolkit.dll y listo. Ahora tenemos disponibles los controles para agregar en nuestras aplicaciones ASP.NET!