2016-11-09 20 views
1

私は奇妙な問題を抱えています。フォームのドロップダウン/選択リストを検証するためにjQuery検証を使用しようとしましたが、検証されません。なぜ、私はタイプミスや文法エラーがないかどうかを二重チェックしました。以下は私のコードのコピーです。jQuery検証ドロップダウンリスト

ありがとうございます!

<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
<script src="~/Scripts/jquery.validate.js" type="text/javascript"></script> 
<script src="~/Scripts/jquery.validate.min.js" type="text/javascript"></script> 
<script> 
    $(function() { 
     //datepicker script 
     $("#datepicker").datepicker({ 
      altField: $('#dateHdn'), 
      dateFormat: "MM-dd-yy" 
     }); //end of datepicker script 

     //configure validation here 
     $("#addform").validate({ 
      rules: { 
       invacc: { required:true }, 
       lvlstat: { required: true } 

      }, 
      messages: { 
       invacc: "please insert a value", 
       lvlstat: "Please choose a status" 
      } 
     })// end of validate script 

     //dropdown script 
     $("#lvlstat").selectmenu({ 
     });//end of dropdown script}); 

     </script> 
     </head> 

<body> 
<form id="addform" method="post" enctype="multipart/form-data" action=""> 
    <fieldset> 
     <legend>Add Required Values</legend> 
     <p> 
      <label for="invacc">Inventory Accuracy: </label> 
      <input type="text" name="invacc" /> 
     </p> 
     <p> 
      <label for="lti">LTI: </label> 
      <input type="text" name="lti" /> 
     </p> 
     <p> 
      <label for="overtime">Overtime: </label> 
      <input type="text" name="overtime" /> 
     </p> 
     <p> 
      <label for="datetime">Date: </label> 
      <input type="text" name="dtval" id="datepicker" /> 
     </p> 
     <p> 
      <label for="lvlstat">Status: </label> 
      <select id="lvlstat" name="lvlstat"> 
       <option value="">Choose an Option</option> 
       <option value="1">Certified</option> 
       <option value="2">Learner</option> 
       <option value="3">Rookie</option> 
      </select> 
     </p> 
     <p><label for="FileUpload">Image Upload: </label> 
     @FileUpload.GetHtml(
     initialNumberOfFiles: 1, 
     allowMoreFilesToBeAdded: false, 
     includeFormTag: false, 
     uploadText: "Upload") 
     </p> 
     <p><input type="submit" name="buttonSubmit" value="Add" /></p> 
     <p><a href="~/main">Return to main page</a></p> 

    </fieldset> 
</form> 
</body> 
+0

'それだけでは意味がありません。あなたがJsfiddle(https://jsfiddle.net/)で問題を再現して、人々があなたに素早い応答を与えることができるならば、それはさらに良いでしょう。 –

+1

あなたはスクリプトの終わりの前に閉じ括弧をコメントしました – Monasha

+0

@Reddyドロップダウン/選択ボックスのみが検証されません。フォーム内の他のテキストボックスは、空であればエラーを生成しますので、選択されたボックスを除き、まだ入力されていません。私はjsfiddleでそれをやろうとし、ここにリンクさせようとします。 – Collin

答えて

0

私はあなたは あなたが二回の検証jqueryのスクリプトが含まれているようですので、(、スクリプトの含みをチェックすることをお勧めこの

$("input[name='buttonSubmit']").click(
    function(){ 
        if($('#lvlstat').val() == ''){ 
       alert('dropdown validationg failed'); 
       return false; 
      } 
    }); 

Fiddle

0

を追加します。バージョンおよび小型化バージョン):

<script src="~/Scripts/jquery.validate.js" type="text/javascript"></script> 
<script src="~/Scripts/jquery.validate.min.js" type="text/javascript"></script> 

さらに、あなたはブラウザコンソールをチェックし、スクリプトが正しく取得されていることを確認し、可能性のあるエラーを特定するには、ブラウザによって提供さ開発ツールを使用することができます。