2016-07-29 4 views
0

Я пытаюсь проверить свою форму, используя parsley.js. Я работаю, как говорит официальная хорошая книга, но по некоторым причинам (что я, очевидно, сейчас не знаю), она не работает ,Parsley JS не подтверждается

Вот код

<div class="container"> 
     <div class="row"> 
      <div class="col-md-4"> 
       <h2>Parsley JS Form Validation</h2> 
       <form data-validate="parsley"> 
        <label>Name </label> 
        <input type="text" name="fname" class="form-control" required /> 
        <label>Email </label> 
        <input type="text" name="email" class="form-control" data-type="email" data-trigger="change" required /> 
        <label>Password </label> 
        <input type="text" name="lname" class="form-control" data-type="password" required /> 
        <br /> 
        <input type="submit" class="btn btn-success" value="Submit"> 
       </form> 
      </div> 
     </div> 
    </div> 

Вот Plunkr ссылка.

+0

[Официальный parsley.js документация] (HTTP : //parsleyjs.org/doc/index.html), [examples] (http://parsleyjs.org/doc/examples.html) – Andreas

ответ

2

Я не знаю, как его сохранить, поэтому я размещаю его здесь: Я изменил версию jquery, версию петрушки (вы использовали старый), а также добавили css из сайта петрушки. Атрибуты тегов были неправильными. это работает:

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title>Parsley JS</title> 
     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
     <link href="https://parsleyjs.org/src/parsley.css" rel="stylesheet" /> 
     <script src="https://code.jquery.com/jquery-1.11.0.min.js"></script> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/parsley.js/2.3.4/parsley.min.js"></script> 
    </head> 
    <body> 
     <div class="container"> 
      <div class="row"> 
       <div class="col-md-4"> 
        <h2>Parsley JS Form Validation</h2> 
        <form data-parsley-validate="parsley"> 
         <label>Name </label> 
         <input type="text" name="fname" class="form-control" required="true" /> 
         <label>Email </label> 
         <input name="email" class="form-control" type="email" data-parsley-trigger="change" required="true" /> 
         <label>Password </label> 
         <input name="lname" class="form-control" type="password" required="true" /> 
         <br /> 
         <input type="submit" class="btn btn-success" value="Submit"> 
        </form> 
       </div> 
      </div> 
     </div>   
    </body> 
</html> 
+1

JQuery не был проблемой, а не 'data-validate =" parsley "' это должно быть как 'data-parsley-validate =" parsley "' –

+0

Для совместимости i alw ays использует jquery 1.XX, поэтому я изменил это. :) – Apostolos

0

Проблема заключалась в том есть использовали data-required вместо этого я должен использовать data-parsley-required, а также вместо data-validate="parsley" должен быть data-parsley-validate="parsley"

Plunkr модифицированного

Смежные вопросы