2014-11-22 39 views
1

經過長時間的網絡研究和pugin文檔,我正在寫這個問題。我可能在這裏錯過了一些東西,但我找不到。bootstrap驗證程序:無法獲取提交的表單(驗證正常)

我使用bootstrapvalidator(http://bootstrapvalidator.com/)插件嘗試驗證引導模式中的表單。

我的表單代碼:

 <form method="POST" action="/venues/update" accept-charset="UTF-8" id="editForm"> 
      <input name="id" type="hidden" value="XYZ"> 
      ... 
      [other form fields...] 
      ... 
      <button type="submit" class="btn bg-black">Modifier</button> 

     </form> 

爲驗證我的js代碼:

$('#editForm') 
      .bootstrapValidator({ 
       message: 'Cette valeur ne peut pas être utilisée.', 
       feedbackIcons: { 
        valid: 'glyphicon glyphicon-ok', 
        invalid: 'glyphicon glyphicon-remove', 
        validating: 'glyphicon glyphicon-refresh' 
       }, 
       submitHandler: function(validator, form, submitButton) { 
        alert('submit!!'); 
       }, 
       fields: { 
        venue_name: { 
         message: 'Ce nom n\'est pas valide.', 
         validators: { 
          notEmpty: { 
           message: 'Le nom du lieu ne peut pas être vide.' 
          }, 
          stringLength: { 
           min: 5, 
           max: 30, 
           message: 'Le nom doit être d\'au moins 5 caractères' 
          }, 
          regexp: { 
           regexp: /^[a-zA-Z0-9_ ]+$/, 
           message: 'Le nom ne peut pas contenir de caractères spéciaux.' 
          } 
         } 
        }, 
        max_capacity: { 
         message: 'Cette valeur n\'est pas valide.', 
         validators: { 
          notEmpty: { 
           message: 'Ce champs ne peut pas être vide.' 
          }, 
          regexp: { 
           regexp: /^[0-9]+$/, 
           message: 'Ce champs nécessite une valeur numérique entière.' 
          } 
         } 
        }, 
        venue_status: { 
         validators: { 
          notEmpty: { 
           message: 'Le status doit être défini.' 
          } 
         } 
        }, 
        venue_location: { 
         validators: { 
          notEmpty: { 
           message: 'La localisation doit être définie.' 
          } 
         } 
        } 
       } 

      }); 

我的問題是,我的驗證步驟效果很好。雖然表單提交併未發生,所以我嘗試將此警報測試添加到調試中。警報也沒有出現,這似乎表明submitHelper沒有被觸發。我現在很迷茫。

回答

6

看來你使用的是舊版本的插件。 根據指南Upgrading to v0.5.0,插件從v0.5.0中刪除submitHandler選項。 改爲使用success.form.bv事件處理程序。

你可以嘗試下面的代碼:

$('#editForm') 
    .bootstrapValidator(options) 
    .on('success.form.bv', function(e) { 
     e.preventDefault(); // Prevent the form from submitting 
     alert('I am going to do other things'); 

     // ... Do whatever you want 

     // If you want to submit the form, use the defaultSubmit() method 
     // http://bootstrapvalidator.com/api/#default-submit 
     $('#editForm').bootstrapValidator('defaultSubmit'); 
    }); 
+0

謝謝你,現在這是明確的。所有按預期工作。 – 2014-11-23 08:18:40

+0

謝謝你的解決方案 – 2017-04-30 19:37:11

+0

鏈接不工作! – 2017-06-01 08:13:13