29 ene 2014

// // Comentar

ASP .NET MVC - Mostrar mensajes de validación de controles en HTML


Introducción


En ASP .NET MVC tenemos un diccionario llamado Model State que almacena los errores de validación que se puedan generar al enviar los datos de un formulario y estos se puedan mostrar al usuario a través de una key que los identifica, pues bien el detalle de esto es que mostrara los mensajes como simple texto y para una necesidad en particular se puede requerir que estos mensajes se muestren en HTML, para ello describo en este post como lograrlo.


Creación de la clase helper


Para mostrar los mensajes de validación en HTML crearemos un helper para lo cual tomaremos como referencia el mismo código fuente de ASP .NET MVC que esta disponible en Codeplex y le haremos algunas modificaciones para lograr nuestro objetivo.

La clase que usaremos para adaptarla a nuestras necesidades será ValidationExtencion.cs de la cual tomaremos los siguientes métodos:
 
public static MvcHtmlString ValidationMessage(this HtmlHelper htmlHelper, string modelName, object htmlAttributes)




 




public static MvcHtmlString ValidationMessage(this HtmlHelper htmlHelper, string modelName, string validationMessage, IDictionary<string, object> htmlAttributes)




 




private static MvcHtmlString ValidationMessageHelper(this HtmlHelper htmlHelper, ModelMetadata modelMetadata, string expression, string validationMessage, IDictionary<string, object> htmlAttributes)




 




private static FieldValidationMetadata ApplyFieldValidationMetadata(HtmlHelper htmlHelper, ModelMetadata modelMetadata, string modelName)




 




private static string GetInvalidPropertyValueResource(HttpContextBase httpContext)




 




private static string GetUserErrorMessageOrDefault(HttpContextBase httpContext, ModelError error, ModelState modelState)





Además de estos métodos de los cuales modificaremos algunos también agregaremos un método, debido a que en ASP .NET MVC esta declarado como interno y no podemos usarlos desde el helper, lo creamos dentro del mismo helper:



 




public static MvcHtmlString ToMvcHtmlString(this TagBuilder builder, TagRenderMode renderMode)







Modificación de métodos



Una vez copiados los métodos a la clase que será nuestro helper, debe quedarnos similar a la imagen siguiente


 




 


Primero hay que renombrar el método ValidationMessage para que se llame ValidationMessageHTML que será así como lo llamaremos desde nuestras vistas.


 


Ahora  el método principal que debemos hacer los cambios es ValidationMessageHelper, dentro de este método cambiamos la línea








FormContext formContext = htmlHelper.ViewContext.GetFormContextForClientValidation();






por


 




FormContext formContext = htmlHelper.ViewContext.ClientValidationEnabled ? htmlHelper.ViewContext.FormContext : null;




 


Esto, debido a que se están usando métodos internos de ASP .NET MVC y no los tenemos disponibles en nuestra clase.


 


También cambiamos la línea principal donde hará que el texto lo devuelva en HTML.


 




builder.SetInnerText(GetUserErrorMessageOrDefault(htmlHelper.ViewContext.HttpContext, modelError, modelState));




por


 




builder.InnerHtml = GetUserErrorMessageOrDefault(htmlHelper.ViewContext.HttpContext, modelError, modelState);




 


Con estos cambios aplicados a los métodos ya podemos hacer uso del helper para que nos muestre los mensajes de error en HTML, simplemente llamándolo de la siguiente manera:








@Html.ValidationMessageHTML("keyerror", new { @class = "field-validation-error-html" })






Les dejo la clase helper que muestro en el post para que la puedan usar directamente.





Leer post completo