Vinicius Quaiato

ASP.NET MVC mudando estilos de mensagens de validação

27/12/2010

Respondendo uma dúvida no gtalk hoje veio a idéia de escrever este post: como mudar os estilos que são usados para exibir as mensagens de erro pelo ASP.NET MVC?Bem a dúvida era sobre como formatar as mensagens de erros que são exibidas nos formulários. É simples. Se você fuçar no fonte do ASP.NET MVC verá esta classe: http://aspnet.codeplex.com/SourceControl/changeset/view/61289#266468.Vejam que temos constantes para as classes(css) de erro a serem utilizadas:

public 
static readonly string ValidationInputCssClassName = "input-validation-error";
    
public 
static readonly string ValidationMessageCssClassName = "field-validation-error";
    
public 
static readonly string ValidationSummaryCssClassName = "validation-summary-errors";

Pois bem, são estes os estilos que precisamos configurar para que nossas mensagens de validação sejam exibidas com alguma formatação.O ASP.NET MVC já cria estes estilos no arquivo /Content/site.css:

Se referenciarmos o arquivo de estilos(Site.css) em nossas views teremos uma mensagem de validação assim:

Vamos alterar o estilo para algo assim:

.field-validation-error{    color: #000;
    font-size:16px;
    border:2px solid #000066;
    padding:3px;
    padding-left:20px;
    background-image: url('/images/error.gif');
    background-repeat: no-repeat;
    }
.input-validation-error{    border: 3px solid #660066;
    background-color: #ffeeee;
    }

Desta forma obteremos um resultado assim:

(notem que eu não sou bom com cores e estilos :P)É isso aê galera. Bastante simples.

Abraços, Vinicius Quaiato.

ASP.NET MVC mudando estilos de mensagens de validação

Voltar