Validación no-intrusiva en ASP.NET 4.5 y errores de validadores

Post original en JASoft.org: http://www.jasoft.org/Blog/post/Validacion-no-intrusiva-en-ASPNET-45-y-errores-de-validadores.aspx

Por defecto, ASP.NET 4.5 (con Visual Studio 2012) cambió la manera en la que funciona la validación de controles. Desde fuera parece que nada ha cambiado, pero por debajo ahora se utiliza por omisión un nuevo tipo de validación no intrusiva basada en jQuery, en lugar de los scripts anteriores.

Ahora, la validación de lado cliente se consigue de una manera más sencilla usando el plugin jQuery validation, y decorando los diferentes controles de validación usando atributos "data-val", en lugar de llenar tu página de scripts de validación.

Por ejemplo, este es el HTML resultante de un control RequiredValidator cuando se está usando el modo de validación no-intrusiva:

   1: <span 
   2:    id="RequiredFieldValidator1" 
   3:    data-val-controltovalidate="TextBox1" 
   4:    data-val-focusOnError="t" 
   5:    data-val-errormessage="Required!" 
   6:    data-val-display="Dynamic" 
   7:    data-val="true" 
   8:    data-val-evaluationfunction="RequiredFieldValidatorEvaluateIsValid" 
   9:    data-val-initialvalue="" 
  10:    style="color:Red;display:none;">Required!</span>

Fíjate en todos esos atributos "data-val". Simplemente echando un vistazo a ese código es muy fácil saber como se comportará este control de validación, lo cual es estupendo.

Sin embargo, si creas una nueva aplicación web vacía con Visual Studio 2012 o posterior y añades un control de validación a alguna página, cuando ejecutes la aplicación verás esta página de error al intentar hacer cualquier validación:

Unobtrusivevalidation_error

Obtienes este error porque los scripts de validación necesitan un recurso de script registrado en el sistema con el nombre "jquery", y no lo encuentran en tu aplicación.

Dispones de varias opciones para que funcione la validación:

1.- Deshabilitar la validación no-intrusiva página  por página

Esto habilitará la validación tradicional de versiones anteriores de ASP.NET Web Forms (hasta la 4.0).

Hacerlo de esta manera, a mano, es tedioso si tienes más de un par de páginas con validadores, pero es muy sencillo. Simplemente tendremos que añadir esta línea al evento Load de tu página:

   1: Page.UnobtrusiveValidationMode = System.Web.UI.UnobtrusiveValidationMode.None;

2.- Deshabilitar la validación no-intrusiva para toda la aplicación

Para conseguirlo tenemos que agregar una línea a nuestro archivo de configuración web.config, colocándola en el nodo appsettings, así:

   1: <appSettings>
   2:     <add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />
   3: </appSettings>

3.- Agregar el ScriptResourceMapping de jQuery, como indica la página de error

Para conseguirlo necesitamos, en primer lugar, descargarnos la última versión de jQuery desde www.jquery.com. Descarga las dos ediciones disponibles (la de producción y la de desarrollo), y colócalas en una carpeta "scripts" bajo la raíz de tu aplicación web.

Ahora necesitamos añadir al proyecto el archivo global de eventos, Global.asax. En su evento Application_Start debemos definir un nuevo ScriptResourceMapping con el nombre "jquery", de manera que la plataforma sepa dónde obtener los scritps de jQuery que necesita.

El código necesario en C# es este:

   1: protected void Application_Start(object sender, EventArgs e)
   2: {
   3:     ScriptManager.ScriptResourceMapping.AddDefinition("jquery",
   4:                 new ScriptResourceDefinition
   5:                 {
   6:                     Path = "~/scripts/jquery-1.8.3.min.js",
   7:                     DebugPath = "~/scripts/jquery-1.8.3.js",
   8:                     CdnPath = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js",
   9:                     CdnDebugPath = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.js"
  10:                 });
  11: }

No te olvides de incluir la siguiente línea en la cabecera del código:

   1: using System.Web.UI;

(o con Imports si usas VB.NET).

Este ScriptResourceMapping tiene el nombre "jquery" y ahora los controles de validación son capaces de localizar los scripts en tiempo de ejecución a través de dicho nombre. Lo que hacemos es indicar la ubicación de las versiones de producción y de depuración del script, tanto localmente como en un CDN (Content Delivery Network, en este caso la que gestiona Microsoft) en caso de que fueran necesarias.

Esta es la mejor manera de proceder, tal y como indica la página de error. En mi opinión debería estar habilitado por defecto de esta manera, pues tal y como está da lugar a muchos problemas para los principiantes si partes de una aplicación vacía.

Si creas un nuevo proyecto web partiendo de la plantilla completa, entonces no tendrás problema alguno, ya que por defecto se instalan diversos paquetes auxiliares en la aplicación, entre los que se encuentra AspNet.ScriptManager.jQuery. Éste tiene su propio código de inicialización que ya añade las bibliotecas necesarias usando un ScriptResourceMapping para incluir jQuery:

AspNet.ScriptManager.jQuery
Pulsa para agrandar

Hay otros paquetes como este que incluyen otros scripts adicionales también.

¡Espero que te resulte útil!

Este post está extraído de mi curso de desarrollo Web con ASP.NET 4 en campusMVP.
Estos son algunos de los cursos que puedes encontrar en el catálogo de campusMVP:
   ·
Preparación del examen 70-515: Desarrollo Web con .NET 4.0 (Tutelado por mi)
   · Desarrollo Web con ASP.NET 4.0 Web Forms (Tutelado por mi)
   · ASP.NET 4.0 Web Forms desde cero (Tutelado por mi)
   · Desarrollo Web con ASP.NET MVC 4  
   · jQuery paso a paso para programadores ASP.NET
   · Visual Studio 2010 desde cero

Archivado en: ,
Comparte este post: