¿Qué es jQuery discreta validación?

Question

Sé lo que es el complemento jQuery Validation. Sé que la biblioteca jQuery Unobtrusive Validation fue creada por Microsoft y está incluida en el framework ASP.NET MVC. Pero no puedo encontrar una sola fuente en línea que explique de qué se trata. ¿Cuál es la diferencia entre la biblioteca jQuery Validation estándar y la versión "discreta"?

Answer 1

Brad Wilson tiene un par de excelentes artículos en unobtrusive validation y unobtrusive ajax.
También se muestra muy bien en este Pluralsight video en la sección sobre "AJAX y JavaScript".

Básicamente, se trata simplemente de validación de Javascript que no contamina su código fuente con su propio código de validación . Esto se hace haciendo uso de los atributos data- en HTML.

Answer 2

Con la forma discreta:

• Usted no tiene que llamar al método validate().
• Se especifica los requisitos que utilizan atributos de datos (data-val, datos-val-requerido, etc.)

Jquery Validar Ejemplo:

<input type="text" name="email" class="required"> 
<script> 
     $(function() { 
      $("form").validate(); 
     }); 
</script> 

Jquery Validar discreto Ejemplo:

<input type="text" name="email" data-val="true" 
data-val-required="This field is required."> 

<div class="validation-summary-valid" data-valmsg-summary="true"> 
    <ul><li style="display:none"></li></ul> 
</div> 

Answer 3

jQuery Validation Unobtrusive Native es una colección de extensiones de ayuda ASP.Net MVC HTML. Estos hacen uso de la compatibilidad nativa de jQuery Validation para la validación impulsada por los atributos de datos HTML 5. Microsoft envió jquery.validate.unobtrusive.js de vuelta con MVC 3. Proporcionó una forma de aplicar validaciones del modelo de datos al lado del cliente utilizando una combinación de validación jQuery y atributos de datos HTML 5 (esa es la parte "discreta").

Answer 4

Para una aclaración, aquí hay un ejemplo más detallado que demuestra Validación de formulario usando jQuery Validación discreta.

Ambos usan el siguiente JavaScript con jQuery:

$("#commentForm").validate({ 
    submitHandler: function(form) { 
     // some other code 
     // maybe disabling submit button 
     // then: 
     alert("This is a valid form!"); 
//  form.submit(); 
    } 
    }); 

Las principales diferencias entre los dos plugins son los atributos que se utilizan para cada enfoque.

jQuery Validación

Simplemente utilice los siguientes atributos:

• conjunto necesario si se requiere
• tipo fijado para el formato correcto (e-mail, etc.)
• establecer otros atributos tales como tamaño (longitud mínima, etc.)

Aquí está la forma ...

<form id="commentForm"> 
    <label for="form-name">Name (required, at least 2 characters)</label> 
    <input id="form-name" type="text" name="form-name" class="form-control" minlength="2" required> 
    <input type="submit" value="Submit"> 
</form> 

jQuery Validación Unobtrusive

Se necesitan los siguientes atributos de datos:

• datos-msg-requiere = "Esto es necesario" requerido-data-regla
• = "verdadero/falso"

Aquí es la forma ...

<form id="commentForm"> 
    <label for="form-x-name">Name (required, at least 2 characters)</label> 
    <input id="form-x-name" type="text" name="name" minlength="2" class="form-control" data-msg-required="Name is required." data-rule-required="true"> 
    <input type="submit" value="Submit"> 
</form> 

Sobre la base de cualquiera de estos ejemplos, si se han llenado los campos del formulario que se requieren y cumplen con los criterios de atributo adicionales, luego aparecerá un mensaje que notifica que todos los campos de formulario están validados. De lo contrario, habrá texto cerca de los campos del formulario ofensivo que indica el error.

Referencias: - jQuery Validación: https://jqueryvalidation.org/documentation/