« - »

Más vale tarde que nunca, Ajax a la palestra

Martes, 15 de enero de 2008

Aunque la tecnología Ajax ya lleva mucho tiempo activa en el mundo web, yo personalmente no me había pegado mucho con ella para sacarle algo de jugo. Hasta ahora me la habían presentado y poco más, mi relación con ella no había sido mucho más allá que alguna prueba práctica. Tampoco quiere decir que ahora ya esté en la pomada de Ajax, pero he hecho mis primeros pinitos de los que estoy orgulloso. Y es lo que tiene Ajax (y todas las librerías/frameworks creadas alrededor de la misma, véase Asp.net Ajax, Prototype, Scriptacolous), que con muy poco esfuerzo consigues cosas muy aparentes.

No voy a pararme a explicar lo que es AJAX (Asynchronous JavaScript And XML). Como ya he dicho, llego un poco tarde al tema y en el mundo web ya está más que explicado. En cualquier caso, para la teoría siempre podéis echar mano de la Wikipedia.

Intentaré enseñar algún ejemplo muy sencillo en próximos posts usando el framework ASP.NET AJAX y su maravilloso Control Toolkit, que nos proporciona muchísimos controles preparados para arrastrar y funcionar. También voy a obviar el "Get Started" en Asp.net Ajax y su Control Toolkit más que nada porque en su web ya tenemos 2  vídeos muy aclaratorios en el que se muestra como instalar y agregar los controles a nuestro Visual Studio, además de mostrar 2 sencillos ejemplos:
Get Started with the ASP.NET AJAX
Get Started with the ASP.NET AJAX Control Toolkit

Ah, por cierto, si aún usáis Visual Studio 2005, las descargas del ASP.NET AJAX 1.0 las han puesto un poco más escondidas, así que os dejo el enlace que me ha costado un poco encontrarlo. Los chicos de Microsoft ya empiezan a priorizar a los usuarios de VS 2008.

En este post introductorio no voy a mostrar ningún ejemplo concreto, simplemente voy a comentar 2 problemillas que me he encontrado al empezar con Ajax por si corréis la misma suerte que yo. Como muchas veces en este mundo, ni vamos a crear algo que no se ha hecho antes ni vamos a ser los primeros que nos enfrentemos a un problema.

Si veis los vídeos "Get Started" os daréis cuenta que es muy fácil y sencillo crear una web nueva desde cero que soporte ASP.NET Ajax y el Control Toolkit y que nos permita agregar los controles Ajax. Muy sencillo gracias a las plantillas que se nos agregan al VS2005; nos crea un proyecto web con un web.config con todos los objetos registrados y demás parámetros necesitados.

El 1er problema viene cuando ya tenemos un proyecto web desarrollado que se creo sin usar las plantillas de Ajax y queremos agregarle algún detalle con Asp.net Ajax. Si somos demasiado optimista y a nuestro "antiguo" proyecto agregamos y configuramos cualquier control Asp.net Ajax directamente, veremos que no funciona y que además obtenemos un error de Javascript:

"‘Sys’ no está definido"

El error se produce porque nos faltan varias instrucciones en el web.config que cuando creamos un proyecto nuevo usando la plantilla correspondiente (Ajax Enabled Web site) el Visual Studio ya nos añade automáticamente.

Estas instrucciones son las siguientes:

<?xml version="1.0"?>
<configuration>
  <configSections>
    <sectionGroup name="system.web.extensions" type="System.Web.Configuration.SystemWebExtensionsSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
      <sectionGroup name="scripting" type="System.Web.Configuration.ScriptingSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
        <section name="scriptResourceHandler" type="System.Web.Configuration.ScriptingScriptResourceHandlerSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/>
        <sectionGroup name="webServices" type="System.Web.Configuration.ScriptingWebServicesSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
          <section name="jsonSerialization" type="System.Web.Configuration.ScriptingJsonSerializationSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="Everywhere"/>
          <section name="profileService" type="System.Web.Configuration.ScriptingProfileServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/>
          <section name="authenticationService" type="System.Web.Configuration.ScriptingAuthenticationServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/>
        </sectionGroup>
      </sectionGroup>
    </sectionGroup>
  </configSections>
  <system.web>
    <pages>
      <controls>
        <add tagPrefix="asp" namespace="System.Web.UI" assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
      </controls>
    </pages>
    <compilation debug="true">
      <assemblies>
        <add assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
      </assemblies>
    </compilation>
    <httpHandlers>
      <remove verb="*" path="*.asmx"/>
      <add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
      <add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
      <add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/>
    </httpHandlers>
    <httpModules>
      <add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
    </httpModules>
  </system.web>
  <system.web.extensions>
    <scripting>
      <webServices>
      </webServices>
    </scripting>
  </system.web.extensions>
  <system.webServer>
    <validation validateIntegratedModeConfiguration="false"/>
    <modules>
      <add name="ScriptModule" preCondition="integratedMode" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
    </modules>
    <handlers>
      <remove name="WebServiceHandlerFactory-Integrated"/>
      <add name="ScriptHandlerFactory" verb="*" path="*.asmx" preCondition="integratedMode" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
      <add name="ScriptHandlerFactoryAppServices" verb="*" path="*_AppService.axd" preCondition="integratedMode" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
      <add name="ScriptResource" preCondition="integratedMode" verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
    </handlers>
  </system.webServer>
</configuration>

Agregando estas instrucciones veremos que ya no tenemos ningún error Javascript y además obtenemos el comportamiento Ajax deseado.

El 2º problema me ha surgido recientemente en un proyecto que me venía heredado, algo que intento evitar siempre que puedo pero que no conseguí esta vez. Concretamente era una aplicación web ASP.NET 1.1 y con el code-behind en Visual Basic. Yo tengo bastante más agilidad con C# y por supuesto evito ya a toda costa desarrollar algo para ASP.NET 1.1 y Visual Studio 2003. Así que lo primero en este proyecto fue migrarlo a ASP.NET 2.0 con el asistente de VS 2005. El asistente completó la migración sin problemas. El problema vino a la hora de usar el Control Toolkit.

Cuando intentaba usar algún objeto del Control Toolkit me daba problemas. Lo que me extrañaba es que el mismo ejemplo de código me funcionaba correctamente en un proyecto nuevo, pero en el proyecto comentado todo lo contrario, a pesar que ya había hecho los cambios pertinentes en el web.config. Así, que tras googlear un poco me encontré con la solución en el blog del gran Scott Guthrie. Si creamos un sitio web con Visual Studio 2003 en el web.config nos agrega la siguiente propiedad:

<configuration>
    <system.web>
        <xhtmlConformance mode="Legacy" />
    </system.web>
</configuration> 

Cuando migramos el proyecto a Visual Studio 2005, esta propiedad se mantiene en el archivo de configuración. Para solucionar los errores con el Control Toolkit, basta con eliminar esta propiedad o darle el valor de "Transitional" o "Strict" a la propiedad xhtmlConformance. Una vez hecho, a seguir jugando con Ajax.

Como comentaba, ni voy a hacer algo que no se ha hecho antes ni soy el primero a enfrentarme al mismo problema. Jorge Serrano nos indicaba como preparar un sitio web para que acepte el Asp.net Ajax y Scott Guthrie nos solucionaba los problemas con el Control Toolkit si venimos de un proyecto ASP.NET 1.1.


2 Respuestas to ' Más vale tarde que nunca, Ajax a la palestra '

Suscribirse a comentarios con RSS or TrackBack to ' Más vale tarde que nunca, Ajax a la palestra '.

  1. Gon dice,

    el marzo 8th, 2013 a las 16:27

    Muchas gracias me sivió de mucho.
    Saludos!!

  2. José Andreu dice,

    el marzo 11th, 2013 a las 22:14

    Me alegro de que te sirviera

    Un saludo!

Dejar una respuesta

Dark traducido por Reproduccion Asistida Inspirado en: Bloggerlounge & Arquitectura