ASP.NET AJAX Extensions: Introduccion

AJAX es un término genérico para definir una colección de tecnologías y procesos que podemos utilizar en nuestras aplicaciones web. ASP.NET AJAX es la implementación comenzada por Microsoft y que luego pasó a ser mantenida por una comunidad e incluye varios beneficios para los desarrolladores.

Muchos desarrolladores hemos encontrado un poco complicado crear aplicaciones con AJAX debido a la complejidad relacionada con JavaScript para implementar funcionalidad AJAX.

ASP.NET AJAX combina una extensa librería de código con una coleccion de componentes del lado del servidor que hacen la vida de los desarrolladores mucho mas simple y pueden ser utilizadas en nuestras aplicaciones AJAX-enabled. Algunos de los beneficios principales de la utilización de esta tecnología harán que nuestras aplicaciones web sean:

- Más dinámicas.
- Con mejores tiempos de respuesta.
- Más fáciles de utilizar.
- Más interesantes desde el punto de vista de usuario.
- Compatibles con la gran mayoria de los browsers.

Funcionalidad del lado del Cliente:
Del lado del cliente, ASP.NET AJAX provee un conjunto de archivos con código JavaScript conocidos como AJAX Library lista para ser agregada a nuestras aplicaciones web. Estos archivos. Estos archivos usan extensiones del lenguaje JavaScript para hacer posible que el código sea parecido a C#, incluyendo el uso de estructuras de Programación Orientada a Objetos (POO) . Esto nos permite a los desarrolles agregar codigo JavaScript a nuestras aplicaciones web de una forma mucho mas fácil. Además, esta librería trabaja con todos los browsers actuales liberando al desarrollador de la tediosa tarea de escribir código específico para cada browser.

Funcionalidad del lado del Servidor:
Para los desarrolladores ASP.NET 2.0 está disponible una serie de controles de servidor conocido como AJAX extensions, estos controles del lado del servidor permiten escribir muy pocas o ninguna linea de código JavaScript. Todos los controles de servidor generan el código JavaScript necesario. Algunos de estos controles conocidos como extenders afectan la funcionalidad o comportamiento de otros controles en vez de proveer su propia interfaz de usuario. De esta forma, podemos utilizar por ejemplo un text box extender para agregar la funcionalidad a un text box de nuestra aplicación para por ejemplo agregar la funcionalidad de autocompletar.

Framework Extensible:
ASP.NET AJAX nos permite extender o ampliar la funcionalidad existente, tanto de código del lado del cliento como de codigo del lado del servidor. Hay disponibles clases bases y archivos JavaScript de los cuales se pueden heredar y agregar funcionalidad. También se puede descargar el AJAX Control Toolkit con el cual tendremos disponibles muchos componentes listos para utilizar (extenders).
El AJAX Control Toolkit incluye una plantilla para simplificar la creación de componentes del lado del cliente.

Hasta aqui una breve introduccion. En proximas entradas ire profundizando en conceptos relaciondos.

Visual Studio add-in: GhostDoc

GhostDoc es un add-in para Microsoft Visual Studio 2003/2005 que permite generar de forma automátizada comentarios XML indispensables para la documentación en nuestros desarrollos. El mayor problema de escribir estos comentarios XML es quye es un trabajo tedioso que demanda tiempo y por lo general se termina escribiendo siempre comentarios generales y similares. El objetivo de GhostDoc es automatizar este trabajo tedioso mirando el nombre de nuestras clases y métodos como así también y realizar una "adivinanza" de lo que los comentarios XML deberían incluir. El único problema, pero que a largo plazo redunda en mejoras a nuestro código es que funciona en inglés y de acuerdo a las recomendaciones en la nomenclatura de nuestros elementos (clases, interfaces o métodos). No debería reemplazar nuestra tarea de documentación pero al menos se encarga de la parte repetitiva de la misma.

- Source / Download: http://www.roland-weigelt.de/ghostdoc/

- Licencia: FREE.

- COPYRIGHT. Copyright © Roland Weigelt

- Proceso de instalación: En el sitio web se pueden obtener los instaladores para las diferentes versiones de VS.NET (2003/2005). El proceso de instalación es bien sencillo y no ofrece complicaciones.

- Integración con el IDE de Desarrollo: Luego de la instalación al abrir VS 2005 nos aparecen dos pantallas para terminar de configurar el ad-in. En las mismas se nos requiere asignar un atajo de teclado donde CTRL+Shift+D es el atajo por defecto aunque podemos seleccionar de un drop down list otras opciones e incluso podemos omitir este paso. Este add-in tiene tres formas principales de integrarse a nuestro IDE

• A través de una opcion en el menú Tools -> GhostDoc
• A través del menú contextual con la opción "Document this"
• A través del atajo de teclado una vez que hemos seleccionado un elemento (clase, interface, método)

- Veamos un ejemplo:

Supongamos que tenemos el siguiente método

    public DataSet getEmployeeList(long companyId, string companyName)
{
DataSet dsEmployees = new DataSet();
// Code for getting DataSet
return dsEmployees;
}

Al seleccionar el método y utilizar cualquiera de las tres opciones enumeradas anteriormente veremos que se genera de forma automática lo siguiente:

    /// <summary>
/// Gets the employee list.
/// </summary>
/// <param name="companyId">The company id.</param>
/// <param name="companyName">Name of the company.</param>
/// <returns></returns>
public DataSet getEmployeeList(long companyId, string companyName)
{
DataSet dsEmployees = new DataSet();
// Code for getting DataSet
return dsEmployees;
}

Como se puede observar, dependiendo de cuan descriptivo sean nuestros nombres de métodos y parámetros y las recomendaciones seguidas en cuestión de nomenclatura, resulta un complemento de mucha utilidad.

Visual Studio add-in: CopySourceAsHtml

CopySourceAsHtml es un add-in para Microsoft Visual Studio 2003/2005 que permite copiar código fuente, coloreo de sintaxis y todo el formato provisto por Visual Studio como HTML para que sea muy cómodo insertarlo en nuestros sitios webs, blogs o foros. En nuestra fase de prueba hemos notado algunos problemas en como se visualiza en Blogger pero si se edita el HTML de Blogger se pueden lograr resultados aceptables. Más abajo incluimos una sección de código C# (aunque puede ser utilizado con VB.NET o cualquier lenguaje soportado por el Framework) para dar un ejemplo de cómo funciona. La idea de este add-in es lograr que un browser visualice el código lo más parecido posible al entorno de desarrollo y lo logra de forma más que aceptable.

- Source / Download: http://www.jtleigh.com/people/colin/software/CopySourceAsHtml/

- Licencia: FREE. COPYRIGHT NOTICE. Copyright © 2006 J.T. Leigh & Associates Inc. All rights reserved.

- Proceso de instalación: En el sitio web se pueden obtener los instaladores para las diferentes versiones de VS.NET (2003/2005). El proceso de instalación es bien sencillo y no ofrece complicaciones.

- Integración con el IDE de Desarrollo: La integración con el IDE de desarrollo es realmente muy simple, intuitiva y efectiva. Todo lo que necesitamos es seleccionar nuestro código fuente y realizar click derecho donde encontraremos la opción "Copy As HTML". Esta opción abre una caja de diálogo donde podemos setear numerosas propiedades como agregar números de línea, el tamaño de la indentación, y hasta podemos incluir código CSS personalizado.

GridView - Paginacion y Ordenamiento simultaneo

Cuando trabajamos con el componente GridView las tareas mas comunes son las de Ordenamiento y de Paginación.
El hecho de lograr ambas tareas de forma simultanea en páginas ASP.NET presenta un pequeño cuidado; se debe mantener el índice de la página en la que estamos cuando establecemos un nuevo criterio de ordenamiento. De la misma forma debemos mantener el criterio de ordenamiento al cambiar el índice de la página a la que queremos acceder.

El código que sigue es un ejemplo o una de las formas, siempre hay mas de una forma :), de como se puede lograr esta tarea.-

- SortingPaging.aspx (nuestra página aspx)

    <asp:GridView ID="gridSample" runat="server" AutoGenerateColumns="false"
     AllowPaging = "true" OnPageIndexChanging = "gridView_PageIndexChanging"
     PageSize = "5"
     AllowSorting = "true" OnSorting = "gridView_Sorting">
     <Columns>
         <asp:BoundField HeaderText="Nombre"
             DataField="Nombre"
             SortExpression = "Nombre" />
         <asp:BoundField HeaderText="Edad"
             DataField="edad"
             SortExpression = "edad" />
     </Columns>
 </asp:GridView>

- SortingPaging.aspx.cs (nuestro archivo de code behind)

using System;
using System.Data;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class SortingPaging : Page {
 protected void Page_Load(object sender, EventArgs e) {
     DataSet ds = new DataSet();
     // Aqui llenamos nuestro DataSet
     DataView dv = ds.Tables[0].DefaultView;
     dv = sortDataView(dv, true);
     gridSample.DataSource = dv;
     gridSample.DataBind();
 }

 private string GridSampleSortDirection {
     get { return ViewState["SortDirection"] as string ?? "ASC"; }
     set { ViewState["SortDirection"] = value; }
 }

 private string GridSampleSortExpression {
     get { return ViewState["SortExpression"] as string ?? "Nombre"; }
     set { ViewState["SortExpression"] = value; }
 }

 private string getSortDirection() {
     switch (GridSampleSortDirection) {
         case "ASC":
             GridSampleSortDirection = "DESC";
             break;

         case "DESC":
             GridSampleSortDirection = "ASC";
             break;
     }
     return GridSampleSortDirection;
 }

 protected void gridView_PageIndexChanging(object sender, GridViewPageEventArgs e) {
     gridSample.DataSource = sortDataView(gridSample.DataSource as DataView, true);
     gridSample.PageIndex = e.NewPageIndex;
     gridSample.DataBind();
 }

 protected DataView sortDataView(DataView dataView, bool isPageIndexChanging) {
     if (isPageIndexChanging) {
         dataView.Sort = string.Format("{0} {1}",
         GridSampleSortExpression,
         GridSampleSortDirection);
     } else {
         dataView.Sort = string.Format("{0} {1}",
         GridSampleSortExpression,
         getSortDirection());
     }
     return dataView;
 }

 protected void gridView_Sorting(object sender, GridViewSortEventArgs e) {
     GridSampleSortExpression = e.SortExpression;
     int pageIndex = gridSample.PageIndex;
     gridSample.DataSource = sortDataView(gridSample.DataSource as DataView, false);
     gridSample.DataBind();
     gridSample.PageIndex = pageIndex;
 }
}