validar - Validación jQuery-Ocultar mensaje de error
resetform(); (10)
Estoy usando el complemento jQuery Validation y quiero desactivar el elemento o contenedor que crea para mostrar el mensaje de error.
Básicamente, quiero que el elemento de entrada con el error tenga la clase de error pero NO cree un elemento adicional que contenga el mensaje de error.
es posible?
Acabo de pensar en una solución CSS, pero realmente no soluciona el hecho de que el elemento todavía se está creando.
<style>
label.simpleValidationError {display: none !important; }
</style>
Como estoy usando CSS para aplicar estilo a la etiqueta.valida, label.error en jquery validate, este botón borró todos los errores e izquierda y los datos en los campos de formulario intactos.
<button onclick="$(''label.error'').css(''display'', ''none'');return false;">Clear Error </button>
La solución más sencilla con solo CSS:
label.valid {
display: none;
}
Posiblemente una solución mucho más simple y semánticamente preferible sería usar CSS
label.error {
position:absolute;
left:20000px;
top:0;
}
input.error {
border:red 1px;
}
No se necesita JS, es más fácil de administrar y alguien con un lector de pantalla realmente tendrá alguna indicación de que se ha perdido algo.
Puede agregar un onfocus y un onkeyup que eliminen el mensaje de error.
$("selector").validate({
onkeyup: false,
onfocusout: false
});
Puede establecer la opción showErrors en una función que solo realiza resaltado de elementos:
$("selector").validate({
showErrors: function() {
if (this.settings.highlight) {
for (var i = 0; this.errorList[i]; ++i) {
this.settings.highlight.call(this, this.errorList[i].element,
this.settings.errorClass, this.settings.validClass);
}
}
if (this.settings.unhighlight) {
for (var i = 0, elements = this.validElements(); elements[i]; ++i) {
this.settings.unhighlight.call(this, elements[i],
this.settings.errorClass, this.settings.validClass);
}
}
}
});
Sin embargo, eso depende en gran medida de las partes internas del complemento de validación, por lo que probablemente no sea seguro. Lo mejor sería que el complemento expone un método defaultHighlightElements()
la misma manera que lo hace para defaultShowErrors()
, pero no es el caso (todavía).
También puedes usar este código:
jQuery.validator.messages.required = "";
$("selector").validate();
También quería ocultar los mensajes de error y convertir mis campos de input
y textarea
rojo, en caso de error. Aquí hay un pequeño ejemplo:
y código completamente funcional en caso de que jsfiddle se rompa;)
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> Demo</title>
<script type=''text/javascript'' src=''http://code.jquery.com/jquery-1.10.1.js''></script>
<script type=''text/javascript'' src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.js"></script>
<style type=''text/css''>
.error {
border: 1px solid red;
}
</style>
<script type=''text/javascript''>//<![CDATA[
$(window).load(function(){
$( "#email_form" ).validate({
rules: {
email: {
required: true,
email: true
}
}, highlight: function(input) {
$(input).addClass(''error'');
},
errorPlacement: function(error, element){}
});
});//]]>
</script>
</head>
<body>
<form name="form" id="email_form" method="post" action="#">
<div class="item" style="clear:left;">
<label>E Mail *</label>
<input id="femail" name="email" type="text">
</div>
Type invalid email and press Tab key
</form>
</body>
</html>
También tuve el mismo problema. No quería mensajes de error, solo los aspectos más destacados de las entradas del formulario que necesitaban atención. Los mensajes ya estaban vacíos, como <?php $msj=''""'';?>
Pero aún así crearon los elementos / contenedores de error después de las etiquetas.
Para evitar que esto ocurriera rápidamente, edité el archivo jquery.validate.js comentando la única línea que indica label.insertAfter(element);
alrededor de la línea 697 +/- ..
Es solo una solución temporal de un novato;) ¡pero lo hizo!
Tenía un proyecto desarrollado por otra biblioteca de validación, quería agregar la biblioteca de validación para usar sus características para comprobar que el formulario es válido o no (la biblioteca de validación utilizada no tiene esa característica)
Mi solución fue: acabo de agregar la biblioteca de validación por su CDN
y use la función de validación al hacer clic:
$(document).on(''click'',''#buttonID'',function(){
var form = $( "#formID" );
form.validate();
console.log(form.valid());
});
e intenté ocultar los mensajes de error que jquery validate al agregar código CSS:
label.error{
display: none!important;
}
Use la opción Validator errorPlacement con una función vacía:
$("selector").validate({ errorPlacement: function(error, element) {} });
Esto efectivamente coloca los mensajes de error en ninguna parte.