觸發歐芹驗證沒有提交表格？

Question

鑒於此代碼，它永遠不會工作，並始終返回真實？

<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>

所以我的問題是，如果有一種方法可以在不添加提交按鈕的情況下觸發歐芹驗證？

Answer 1

$form.parsley('validate')是1.x API。 它在您可能使用的2.x版本中已棄用。

請嘗試使用$form.parsley().validate() 。

最好

Answer 2

我一直在高低搜索，嘗試使用非表單標簽進行表單驗證。 我想我對框架的最大抱怨是它不能與非表單元素一起開箱即用。 如果每次嘗試驗證時都沒有滾動到頁面頂部，我可以使用表單元素。 因為這種行為是表單的工作方式所固有的，所以只有這樣才能修復它。

正如旁注，在div標簽上使用data-parsley-validate屬性也可以。 您也可以正常初始化表單（這意味着您可以訂閱驗證）。

示例html：

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

只需確保將js放入：

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

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

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

Answer 3

如果你在按鈕上放置type =“button”，它將不會刷新並在單擊時滾動到頁面頂部。