2012-07-20 49 views
0

我正在使用一個真棒插件來驗證我的表單在前端:http://docs.jquery.com/Plugins/Validation。問題是表單有兩個按鈕(返回並提交)。我可以繞過使用css類取消驗證表單的後退按鈕,這要歸功於插件;但其他js仍然會觸發(動畫gif,禁用提交按鈕以及提交不透明度的更改)。 DARN。jquery驗證插件兩個按鈕

我試着在submitbtn的點擊函數中包裝整個東西,所以後退按鈕與它沒有任何關係,這是行不通的。我也嘗試把後退按鈕放在一個可以反轉樣式效果的點擊功能中,但這種功能無效。

我尋求更聰明的男人或女人的建議,謝謝!

$(".simple_form").validate({ 
    submitHandler: function(form) { 
     $(".submitbtn").addClass("opacitychangeonsubmit"); // change submit button opacity 
     $(".submitbtn").attr("disabled", true);// disable the submit btn 
     $('#loading_image').show(); // show animated gif 
     form.submit(); 
    } 
}) 
+0

我可以檢查某個地方的課程,並返回false嗎? – jahrichie 2012-07-20 22:20:46

+0

您可以將「返回」按鈕更改爲「type ='button''而不是'type ='submit''? – 2012-07-21 15:46:07

+0

@AndrewWhitaker感謝您的建議,不幸獲勝;在這種情況下工作:-( – jahrichie 2012-07-22 16:43:33

回答

0

我走了一條不同的路線,雖然工作得很好,但有點醜陋和駭人聽聞。

$(".simple_form").validate({ 
    submitHandler: function(form) { 

     if ((form.elements.item(10).value) == "Back") { 
      form.submit(); 
     } else { 
      $(".submitbtn").addClass("opacitychangeonsubmit"); // change submit button opacity 
      $(".submitbtn").attr("disabled", true);// disable the submit btn 
      $('#loading_image').show(); // show animated gif 
      form.submit(); 
     } 
    } 
}); 
0

嘗試將除「form.submit();」之外的所有內容都放入「成功」回調中。

$(".simple_form").validate({ 
    success: function() { 
    $(".submitbtn").addClass("opacitychangeonsubmit"); // change submit button opacity 
    $(".submitbtn").attr("disabled", true);// disable the submit btn 
    $('#loading_image').show(); // show animated gif 
    }, 
    submitHandler: function(form) { 
    form.submit(); 
    } 
}); 

的想法是高亮顯示的形式爲不活動僅在驗證成功和形式實際上已提交。

+0

幾乎,但即使表單沒有驗證,現在仍然會激活gif動畫,所以在您修復錯誤時仍會繼續。 – jahrichie 2012-07-20 21:22:40

+0

確保沒有剩餘的綁定,例如一些'click',它顯示了加載鏡像 – Zlatev 2012-07-20 21:26:12

+0

它沒有從$('#loading_image')show中觸發show(); // show animated gif – jahrichie 2012-07-20 21:36:46