jQuery驗證插件多個複選框

我在使用jQuery Validator插件時遇到了一些困難。我有一個複選框列表不同name屬性，我似乎無法弄清楚如何確保其中至少有一個已被檢查。我在Google上找到的所有內容似乎只在name屬性相同時才起作用。jQuery驗證插件多個複選框

下面是一些示例代碼（更新）：

<ul id="email_lists"> 
    <li> 
     <input name="checkbox1" type="checkbox" /> List 1 
    </li> 
    <li> 
     <input name="checkbox2" type="checkbox" /> List 2 
    </li> 
    <li> 
     <input name="checkbox3" type="checkbox" /> List 3 
    </li> 
    <li> 
     <input name="checkbox4" type="checkbox" /> List 4 
    </li> 
</ul>

我想確保那些至少一個被選中。不幸的是，我不能使其名稱與提交給第三方電子郵件營銷應用程序的表單相同，並且期望這些複選框具有特定的name屬性。

更新

我知道如何做到這一點使用普通的jQuery，但我寧願使用jQuery Validator插件，因爲這是如何將所有的頁面上的其他驗證完成。

我可以使用jQuery將這些複選框分組，說$('#email_lists li');，但我不確定如何使用類似的東西，並告訴jQuery Validator插件使用它作爲一個組。

來源

2010-10-01 Jared

假設你可以給複選框類名（jQuery的需要東西一起工作）：

<input class="validationGroupOne" name="checkbox1" type="checkbox" /> 
<input class="validationGroupOne" name="checkbox2" type="checkbox" /> 
<input class="validationGroupOne" name="checkbox3" type="checkbox" /> 
<input class="validationGroupOne" name="checkbox4" type="checkbox" />

你應該能夠在.validationGroupOne類選擇器插上地方，通常，name屬性。

來源

2010-10-01 02:47:49

我可以給他們AC lass名稱，或者因爲我實際上把它們放在一個無序列表中，所以我可以沿着$（'＃idOful input [type = checkbox]'）的行來做這件事。我在哪裏可以找到.validationGroupOne的文檔？ – Jared 2010-10-01 04:04:28

@Jared：那只是我用過的一個隨機類名;我不認爲它對這個例子之外的任何東西都沒有任何重要性或相關性。是的，大概你可以很容易地通過'ul'訪問它們。雖然我沒有使用這個插件，所以我不是100％。 – 2010-10-01 04:09:36

啊，我認爲這實際上是一個規則或額外的方法，是jQuery驗證插件的一部分。我想我的問題是如何告訴jQuery驗證插件然後使用該組？那是我認爲我的困惑所在。 – Jared 2010-10-01 12:59:33

這是我的解決辦法:-)

使用：

<div id="list"> 
<input name="chkbox" type="checkbox" /> 
<input name="chkbox" type="checkbox" /> 
<input name="chkbox" type="checkbox" /> 
<input name="chkbox" type="checkbox" /> 
</div> 

<input type="hidden" name="the_real_field_name" />

然後在JQuery驗證插件塊：

rules : { 
     chkbox: "required" 
     },

隨後這些值作爲數組存儲到單個隱藏字段像：

function updateInput() { 
    var allVals = []; 
    $('#list :checked').each(function() { 
     allVals.push($(this).val()); 
    }); 
    $('#the_real_field_name').val(allVals); 
} 
$(function() { 
    $('#list input').click(updateInput); 
    updateInput(); 
});

來源

2013-01-09 22:40:31

jQuery驗證插件多個複選框

回答

相關問題