如何禁用multipart表單上的下一個按鈕？

Question

所以我有一個多部分形式，我正在努力檢查每個步驟的值，並在該步驟中對輸入字段執行一些基本驗證。我在我的例子中的代碼大部分工作，但我似乎無法弄清楚如果如果驗證失敗，如何防止表單移動到下一步。任何人都有一個想法如何做到這一點？

Jsfiddle example

Answer 1

爲了防止對按鈕的形式submition單擊如果無效則需要返回false點擊事件。這裏是my JSFiddle

$("#btnPage2").click(function() { 
     var isValid = true;//added local variable to track validation 
     $("#group1 input[type=text]").each(function() { 
      if((this.value) == "") { 
       isValid = false;//form was not valid 
       return false; 
      } 
     }); 
     if (! isValid) {//when form is not valid, return false 
      return false; 
     } 
    }); 

按照要求，這是我會怎麼做時，我想將事件綁定到所有btnPage按鈕。它檢索按鈕所在的組號（在這種情況下，您的btnPage結尾處的數字減1就是組號），並在每個語句中使用它進行驗證。 Fiddle Here

$('a[id^="btnPage"]').click(function() { 
    var groupNum = +($(this).attr('id').replace('btnPage', '')) - 1;//get the group number to validate 
    var isValid = true;//added local variable to track validation 
    $('#group' + groupNum + ' input[type=text]').each(function() { 
     if(this.value == "") { 
      isValid = false;//form was not valid 
      return false; 
     } 
    }); 
    if (! isValid) {//when form is not valid, return false 
     return false; 
    } 
});