驗證必填選擇不起作用

根據接受的答案here這就是我必須做的，以使驗證所需的選擇工作。驗證必填選擇不起作用

我在jsfiddle上創建了一個樣本，但是我無法工作。

主要區別在於我的默認值只是空的（「」）。

<form id="myform"> 
    <select id="id_deals-0-currency" class="required" name="deals-0-currency"> 
    <option value="">---------</option> 
    <option selected="selected" value="1">USD - $</option> 
    <option value="2">EUR - €</option> 
    </select> 
</form> 

$(function() { 
    $(document).ready(function() { 

     $.validator.addMethod("valueNotEquals", function(value, element, arg) { 
      return arg != value; 
     }, "Value must not equal arg."); 


     $("#myform").validate({ 
      rules: { 
       deals-0-currency: { 
        valueNotEquals: "" 
       } 
      }, 
      messages: { 
       deals-0-currency: { 
        valueNotEquals: "Please select an item!" 
       } 
      } 

     }); 
    }); 
})

來源

2012-12-23 Houman

你的代碼的工作，與您需要引用deals-0-currency作爲例外對象關鍵字和空字符串默認值被required類別取代，這使得驗證中需要該項目。空值將觸發所需的消息總是先和您的驗證方法永遠不會有""

$("#myform").validate({   
    rules: { 
     'deals-0-currency': { 
      valueNotEquals: "" 
     } 
    }, 
    messages: { 
     'deals-0-currency': { 
      valueNotEquals: "Please select an item!" 
     } 
    } 
});

DEMO的當前默認觸發（除去所需的類）http://jsfiddle.net/WGL4j/7/

編輯：爲了驗證選擇時改變使用validator valid()方法，其可以僅在整個的形式或單獨的元件被稱爲：

$('#id_deals-0-currency').change(function(){ 
      $(this).valid() 
})

更新演示：http://jsfiddle.net/WGL4j/8/

來源

2012-12-23 14:07:34 charlietfl

+1 This works。非常感謝。可惜我必須自己照顧'變化'事件。增加了額外的複雜性。但我想這是沒有辦法的。 – Houman

查理，我已經分叉你的答案，並希望通過使用類而不是字段名稱來實現它。我幾乎得到它，但它不喜歡我定義我的'消息'的方式。我有一個小提琴http://jsfiddle.net/houmie/8rn89/1/你有任何想法如何解決這個問題？非常感謝 – Houman

只需添加規則。您已經在'addMethod'中定義了該消息。 DEMO：http://jsfiddle.net/8rn89/2/如果您想將消息與規則一起添加，請在新規則對象中完成......請參閱文檔示例中的語法：http://docs.jquery.com /Plugins/Validation/rules#.22add.22rules – charlietfl

首先，你不寫有效的JavaScript。你的名字不能有破折號！切換到'_'或引用名稱，它將是有效的。請記住，始終使用像JSLint或JSHint這樣的工具來運行JavaScript。

代碼中的另一個奇怪之處在於，您有一個嵌套在對方內部的$(function(){}) handler和$(document).ready(function(){})處理程序。這不會破壞你的代碼，但是沒有必要。

在選擇值更改時檢查驗證方面，您需要手動調用驗證。 JQuery Validation comes with the method valid to do this。更新你準備好的功能來包含這一行。

$('id_deals-0-currency').on('change', function() { $('#myform"').valid(); });

好了，現在的變化全部到位，最後的代碼應該如下所示（entire working jsFiddle here）：

<html> 
<head> 
<script src="/path/to/jquery-1.8.3.min.js"></script> 
<script src="/path/to/jquery.validate.js"></script> 
<script> 
$(function() { 
    $.validator.addMethod("valueNotEquals", function(value, element, arg) { 
     return arg != value; 
    }, "Value must not equal arg."); 


    $("#myform").validate({ 
     rules: { 
      deals_0_currency: { 
       valueNotEquals: "" 
      } 
     }, 
     messages: { 
      deals_0_currency: { 
       valueNotEquals: "Please select an item!" 
      } 
     } 

    }); 

    $('#id_deals-0-currency').on('change', function() { $('#myform').valid(); }); 
}); 
</script> 
<body> 
<form id="myform" method="post"> 
     <select id="id_deals-0-currency" class="required" name="deals_0_currency"> 
     <option value="">---------</option> 
     <option selected="selected" value="1">USD - $</option> 
     <option value="2">EUR - €</option> 
     </select> 
</form> 
</body> 
</html>

來源

2012-12-23 14:06:24 scottheckel

可以驗證單個元素或元素集合...在選擇更改時觸發所有表單錯誤沒有意義 – charlietfl

...表單有一個元素... – scottheckel

確定..demo有一個元素...是否有可能整個現場表格是一個選擇？ – charlietfl

驗證必填選擇不起作用

回答

相關問題