Validación Jquery: Cómo hacer que los campos sean rojos

Question

Estoy usando jquery y jquery.validate.cs (jQuery Validation Plugin 1.8.0) para validar un formulario. En este momento, muestra un mensaje al lado de un campo que dice: "Este es un campo obligatorio".

También quiero que cada campo cambie al color rojo. ¿Como podría hacerlo? ¡Gracias!

Answer 1

sin ninguna configuración personalizada, puede simplemente hacer esto:

select.error, textarea.error, input.error { 
    color:#FF0000; 
} 

• La clase predeterminada que se aplica a una entrada no válida es error
• La clase predeterminada para una entrada que se validó es valid.

Estas clases también se aplican a la etiqueta de error, así que tenlo en cuenta al escribir tu CSS.

• demo con las clases predeterminadas: http://jsfiddle.net/wesley_murch/j3ddP/2/

El validation plugin le permite configurar estos nombres de clases, por lo que puede hacer algo como esto:

$("form").validate({ 
    errorClass: "my-error-class", 
    validClass: "my-valid-class" 
}); 

.my-error-class { 
    color:#FF0000; /* red */ 
} 
.my-valid-class { 
    color:#00CC00; /* green */ 
} 

• Demostración de clases personalizadas: http://jsfiddle.net/wesley_murch/j3ddP/1/

Las opciones de configuración se pueden encontrar en http://docs.jquery.com/Plugins/Validation/validate

Answer 2

uso de Firebug para ver lo que la clase del elemento de error es y luego usar CSS para que sea rojo:

.error-label { 
    color: red; 
} 

Answer 3

$("#myform").validate({ 
    error: function(label) { 
    $(this).addClass("error"); 
    }, 
}); 

uso del parámetro errorClass añadir la clase .invalid:

input.error { 
    color: red; 
}