問題與jQuery驗證

Question

我見過噸如何選擇列表上使用jQuery驗證樣本 - 我試圖實現一個，但它只是不爲我工作。我對這個插件一般都很陌生，對於我在做什麼錯誤感到困惑不解。

預期的行爲是，它不應該驗證用戶是否已經離開了選擇菜單「默認」。他們必須做出選擇。

我開始接線新的驗證方法。

的Javascript

(function($) { 
    $.validator.addMethod('mustbe', function(value, element, params) { 
     var testValue = params['propertyvalue']; 
     var condition = params['condition']; 
     if ((condition == '0') && (value != testValue)) return true; 
     if ((condition == '1') && (value == testValue)) return true; 
     return false; 
    }); 
})(jQuery); 

$(document).ready(function() { 
    $("#form1").validate(); 

    $('#form1').submit(function() { 
     alert($('#form1').valid()); 
    }); 
});​ 

然後，我通過添加元數據的實際HTML隨動。

HTML

<form id="form1" action=""> 
<select id="select_list" data-val="true" 
     data-val-mustbe="You must select a value" 
     data-val-mustbe-condition="0" 
     data-val-mustbe-propertyvalue="default" 
     data-val-required="You must select a value" > 
     <option value="default">Choose...</option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
</select> 
<input type="submit" id="submit" value="Submit" /> 
</form>​ 

它只是拒絕驗證。這裏是一個鏈接到一個小提琴，太：

jsFiddle

Answer 1

你應該告訴你正在使用ASP.NET MVC。它不會幫助，但人們會停止詢問自定義屬性名稱。

我重新設計了您的代碼以使用value default和data-val屬性。這是一個代碼示例：

$(document).ready(function() {  
    $.validator.addMethod("valueNotEquals", function(value, element, arg){ 
     return arg != value; 
    }, ""); 

    $("#form1").validate({ 
     rules: { 
      select_list : {valueNotEquals: $('#select_list').attr('data-val-mustbe-propertyvalue')}, 
     }, 
     messages: { 
      select_list : { valueNotEquals: $('#select_list').attr('data-val-required') } 
     },   
     submitHandler: function(form) { 
      alert($('#form1').valid()); 
      form.submit(); 
     } 
    }); 
}); 

編輯：

而且這裏有一個的jsfiddle例如：http://jsfiddle.net/Gajotres/ekPpS/

而這裏沒有ASP.NET MVC版本屬性：

<form id="form1" action=""> 
    <select id="select_list" name="select_list"> 
      <option value="default">Choose...</option> 
      <option value="1">1</option> 
      <option value="2">2</option> 
    </select> 
    <input type="submit" id="submit" value="Submit" /> 
</form> 

$(document).ready(function() {  
    $.validator.addMethod("valueNotEquals", function(value, element, arg){ 
     return arg != value; 
    }, ""); 

    $("#form1").validate({ 
     rules: { 
      select_list : {valueNotEquals: "default"}, 
     }, 
     messages: { 
      select_list : { valueNotEquals: "You must select a value" } 
     },   
     submitHandler: function(form) { 
      alert($('#form1').valid()); 
      form.submit(); 
     } 
    }); 
}); 

Answer 2

簡單的方法是默認選項，使用value=''，並指定select要求：

<select id="select_list" class="required"> 

Answer 3

因此，答案由Barmar部分正確，但沒有很好解釋。

改變我做了讓this updated fiddle工作：

添加NAME =「select_list中」 select元素本身給jquery.validate它想要尋找

改進的JavaScript調用validate ：

$("#form1").validate({ 
    rules: { 
    select_list: { 
     required: true, 
     number: true 
    } 
    }, 
submitHandler: function(form) { 
    alert($('#form1').valid()); 
    form.submit(); 
} 
});