使用jquery验证和jquery-ui datepicker

时间:2014-04-02 03:14:40

标签: jquery validation datepicker

如何让jq-ui datepicker在jquery验证引擎旁工作?

起初,我的datepicker在我放置验证器之前正在工作。现在验证器正在工作,但是日期选择器不是。

//datepciker
   $(function() {   
      $( "#datepicker" ).datepicker({ changeYear:true,changeMonth:true });
   });


//jqueryValidation
        $(document).ready(function(){
          $("#form").validationEngine();
        });



    <fieldset>
    <form  id="form" method="post" action="post.php">
        <table>
            <tr>
                <td>NIP*</td>
                <td><input class="validate[required,custom[onlyNumberSp]"
                id="nip" maxlength="18" name="nip" size="20" type="text"></td>
            </tr>
            <tr>
                <td>TMT*</td>
                <td><input id="datepicker" name="tmt" type="text"></td>
            </tr>
        </table>
    </form>
</fieldset>

1 个答案:

答案 0 :(得分:1)

检查下面的代码,确保正确加载了所有js和css文件。此外,您在验证的输入类中似乎缺少右括号“]”,尽管它实际上似乎没有什么区别。

这段代码在我的服务器上运行得非常好。

<!doctype html>
<html lang="en">
<head>
   <meta charset="UTF-8">

   <title>Validate</title>

   <link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/>
   <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" />

   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
   <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
   <script src="js/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
   <script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>

   <fieldset>
      <form  id="form" method="post" action="post.php">
         <table>
            <tr>
               <td>NIP*</td>
               <td>
                  <input class="validate[required,custom[onlyNumberSp]]" id="nip" maxlength="18" name="nip" size="20" type="text"/>
               </td>
           </tr>
           <tr>
              <td>TMT*</td>
              <td>
                 <input id="datepicker" name="tmt" type="text"/>
              </td>
           </tr>
      </table>
   </form>
</fieldset>

<script type="text/javascript">
   //datepicker
   $(function() {   
      $( "#datepicker" ).datepicker({ changeYear:true,changeMonth:true });
   });


   //jqueryValidation
   $(document).ready(function(){
      $("#form").validationEngine();
   });
</script>

</body>
</html>