javascript - validacion - validar formulario jquery antes de enviar

¿Desea activar la validación del perejil sin enviar el formulario?

Question

Dado este código, ¿nunca funciona y siempre devuelve verdadero?

<form id="my-form" data-validate="parsley">
  <p>
    <label for="username">Username * :</label>
    <input type="text" id="username" name="username" data-required="true" >
  </p>

  <p>
    <label for="email">Email Address * :</label>
    <input type="text" id="email" name="email" data-required="true" >
  </p>

  <br/>

  <!-- Validate all the form fields by clicking this button -->
  <a class="btn btn-danger" id="validate" >Validate All</a>
</form>

<script>
var $form = $(''#my-form'');
$(''#validate'').click (function () {
    if ( $form.parsley(''validate'') )
      console.log ( ''valid'' ); <-- always goes here
    else
      console.log (''invalid'');
});

</script>

¿Entonces mi pregunta es si hay una manera de activar la validación del perejil sin agregar un botón de envío?

Answer 1

He estado buscando alto y bajo para intentar que la validación de formularios funcione con una etiqueta que no sea de formulario. Supongo que mi mayor queja con el marco es que no funciona fuera de la caja con elementos que no son formularios. Estaría bien si utilizara un elemento de formulario si no se desplazara a la parte superior de la página cada vez que intentara validar. Debido a que este comportamiento es inherente a la forma en que funciona el formulario, solo existe este truco para solucionarlo.

Al igual que una nota al margen, el uso del atributo validar perejil de datos en la etiqueta div también funciona. También puede inicializar el formulario normalmente (lo que significa que puede suscribirse a la validación).

ejemplo html:

<div id="signupForm" data-parsley-validate>
    ... put form inputs here ...
    <button id="signupBtn">Sign me up</button>
</div>

Solo asegúrate de poner js en:

var $selector = $(''#signupForm''),
    form = $selector.parsley();

form.subscribe(''parsley:form:success'', function (e) {
    ...
});

$selector.find(''button'').click(function () {
    form.validate();
});

Answer 2

$form.parsley(''validate'') es la API 1.x. Estaba en desuso en las versiones 2.x que podrías usar.

Pruebe $form.parsley().validate() lugar.

Mejor