使用Jquery进行条件验证有时不起作用

Question

我已经实现了Jquery Validator，但面临着某些有时无法正常工作的条件验证的问题。

1. 我有要求控制应该是需要的，如果单选按钮被选中，我已经创建函数被调用，我传递单选按钮的名称。
2. 我也面临着其他验证这个问题仅如果任何两个单选按钮中选择出的3

当我添加警报每次功能警报被调用，但验证需要控制不
我已经被截断我的验证码让我知道，如果我做错了什么

JS代码： -

$('#ConditionalLiability').validate({ 
    onfocusout: false, 
    onkeyup: false, 
    rules: { 
     ConcernsNoted: { 
      required: true 
     }, 
     ConcernsWithExteriorWalls: { 
      required: ValidationRadio("ConcernsNoted", 'Y') 
     }, 
     chkExteriorWalls: { 
      required: ValidationRadio("ConcernsWithExteriorWalls", 'Y') 
     }, 
     GranularLossComments: { 
      required: Conditional("GranularLoss") 
     } 
    }, 
    showErrors: function (errorMap, errorList) { 
     var messages = ""; 
     var check = 0; 
     $.each(errorList, function (index, value) { 
      check = 1; 
      var id = $(value.element).attr('id'); 
      messages += (index + 1) + ". " + value.message + "\n"; 
     }); 
     messages = "Please correct following errors \n" + messages; 
     if (check == 1) { 
      alert(messages); 
     } 
    }, 
    submitHandler: function() { 
     SaveData(); 
    }, 
    messages: { 
     ConcernsNoted: { 
      required: "Please select a value for Concerns With Home Exterior" 
     }, 
     ConcernsWithExteriorWalls: { 
      required: "Please select a value for Concerns With Exterior Walls" 
     },   
     chkExteriorWalls: { 
      required: "Please select at least one option for Concerns with Exterior Walls" 
     }, 
     GranularLossComments: { required: "Please enter comments for GranularLoss" 
     } 

    } 
}); 


function Conditional(id) { 
    var element = "input:radio[name='" + id + "']:checked"; 
    var radio_value = $(element).val(); 
    if ((radio_value == 'M') || (radio_value == 'S')) { 
     return true; 
    } else { 
     return false; 
    } 
} 

function ValidationRadio(id, check) { 
    var element = "input:radio[name='" + id + "']:checked"; 
    var radio_value = $(element).val(); 
    if (radio_value == check) { 
     alert('true'); 
     return true; 
    } else { 
     return false; 
    } 
} 

Answer 1

.validate()是插件的初始化方法，但是，as per your jsFiddle，你会自动调用它，仿佛它是用于测试形式有效性的方法...

$(document).ready(function() { 
     $('#submit').click(function() { 
     submitForm(); 
    }); 
}); 

function submitForm() { 
    $('#ConditionalLiability').validate({ 
     // options & rules 
    }); 
} 

function Conditional(id) { 
    // your code 
} 

function ValidationRadio(id, check) { 
    // your code 
} 

初始化完成后，该插件捕捉提交按钮的单击事件。

• 摆脱您的click处理程序。你不需要它，在很多情况下，它会干扰插件的默认行为。

另外：

• 由于您使用jQuery Mobile的使用.on('pageinit', function()代替.ready(function()

• 摆脱你破碎的外部条件的功能和利用depends子选项，而不是（见下文）。

重因子代码到这个...

$(document).on('pageinit', function() { 

    $('#ConditionalLiability').validate({ 
     onfocusout: false, 
     onkeyup: false, 
     rules: { 
      ConcernsNoted: { 
       required: true 
      }, 
      ConcernsWithExteriorWalls: { 
       required: { 
        depends: function (element) { 
         return $("[name='ConcernsNoted'][value='Y']").is(":checked"); 
        } 
       } 
      }, 
      chkExteriorWalls: { 
       required: { 
        depends: function (element) { 
         return $("[name='ConcernsWithExteriorWalls'][value='Y']").is(":checked"); 
        } 
       } 
      }, 
      GranularLossComments: { 
       required: { 
        depends: function (element) { 
       return ($("[name='GranularLoss'][value='M']").is(":checked") || $("[name='GranularLoss'][value='S']").is(":checked")); 
        } 
       } 
      } 
     }, 
     showErrors: function (errorMap, errorList) { 
      var messages = ""; 
      var check = 0; 
      $.each(errorList, function (index, value) { 
       check = 1; 
       var id = $(value.element).attr('id'); 
       messages += (index + 1) + ". " + value.message + "\n"; 
      }); 
      messages = "Please correct following errors \n" + messages; 
      if (check == 1) { 
       alert(messages); 
      } 
     }, 
     submitHandler: function() { 
      SaveData(); 
     }, 
     messages: { 
      ConcernsNoted: { 
       required: "Please select a value for Concerns With Home Exterior" 
      }, 
      ConcernsWithExteriorWalls: { 
       required: "Please select a value for Concerns With Exterior Walls" 
      }, 
      chkExteriorWalls: { 
       required: "Please select at least one option for Concerns with Exterior Walls" 
      }, 
      GranularLossComments: { 
       required: "Please enter comments for GranularLoss" 
      } 
     } 
    }); 

}); 

DEMO：http://jsfiddle.net/6GHKN/