Popup de validación de formulario mínima en JavaScript puro-popup-Validation

Vista prévia

Descripción

Una biblioteca de JavaScript ligera, ES5/ES6 para validar los campos de formulario y mostrar mensajes de error en una ventana emergente cuando no es válido.

Funcionamiento

Cargue la versión minimizada del JavaScript y la hoja de estilos de la validación emergente en el documento HTML.

<link href="validation.min.css" rel="stylesheet">
<script src="validation.min.js"></script>

Agregue las reglas de validación a los campos de formulario utilizando el atributo ' Data-Validate ' como se indica a continuación:

<input id="fullName" class="validate" data-validate="required">
<input type="email" id="email" class="validate" data-validate="required, email">
...

Inicialice el validador en el formulario. Hecho.

validation.init("form");

La biblioteca le permite crear sus propias reglas de validación de la siguiente manera:

const Rules = validation.getRules();
Rules["custom"] = {

message: "Error Message here",

method: el => {


// ... rule here ...

}


}

<input class="validate" data-validate="required,custom">

API methods.

// shows error messages
validation.highlight(); // show errors

// hides error messages
validation.hideall();

 // checkes if is valid (body by default)
validation.isValid();

 // checkes if is valid (body by default) + highlight
validation.validate();

 // shows a custom message
validation.show(el, message);

// hides the message
validation.hide();

Registro de cambios

v3.0.3 (10/07/2018)

• refactorizar, soporte de IE9, construir