jQueryプラグインによる複数フォームの検証送信ボタンなしのonclickによる送信

Question

私は複数のフォームを持っていますが、jquery検証プラグインによる検証が必要です。送信ボタンを使用するとうまくいきますが、クリック機能でjqueryを使用してフォームを送信すると、最初のフォームのみが機能し、他のフォームは機能しません。使用が提出：ここ

は

HTML ...

<form class="validateForm"> 
    <div class="form-group has-feedback"> 
     <input id="form-field-9" class="form-control new_stock" name="new_stock" type="text"> 
    </div> 
    <a href="javascript:void(0)" class="btn btn-xs btn-green stock_details" title="Product Stock Update"> 
    <i class="fa fa-edit"></i> 
     Stock Update 
    </a> 
</form> 

私のjqueryのは......

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.4.min.js"></script> 
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script> 
<script> 
    $(function() { 
     var site_url = $('.site_url').val(); 
     var stockUpdateForm = $('.validateForm').each(function(key, form) { 
      $(form).validate({ 
       rules: { 
        new_stock: { 
         required: true, 
         digits:true 
        } 
       }, 
       highlight: function (element) { 
        $(element).closest('.form-group').removeClass('has-success').addClass('has-error'); 
       }, 
       unhighlight: function (element) { 
        $(element).closest('.form-group').removeClass('has-error').addClass('has-success'); 
       }, 
       errorElement: 'span', 
       errorClass: 'help-block', 
       errorPlacement: function (error, element) { 
        if (element.parent('.input-group').length) { 
         error.insertAfter(element.parent()); 
        } else { 
         error.insertAfter(element); 
        } 
       } 
      }); 
     }); 
     $('.stock_details').on('click', function() { 
      if(stockUpdateForm.valid()) { 
       // only one form work but another form not working 
      } 
     }) 
    }) 
</script> 

注.......私のコードですボタンは正常に機能していますが、機能していません。

Answer 1

コード...

$('.stock_details').on('click', function() { 
    if(stockUpdateForm.valid()) { .... 

特定のフォームまたはフォーム要素にのみ.valid()メソッドを添付できますが、stockUpdateFormはどちらの種類のものでもありません。

代わりにこれを試してください。 jQueryの$(this)キーワードを使用すると、クリックしたボタンを囲む関連するformのみをターゲットにすることができます。

$('.stock_details').on('click', function() { 
    if($(this).parent('form').valid()) { ....