Question

我正在使用jquery表单验证。我有一组从数据库生成的复选框。

复选框具有相同的名称和相同的ID。我使用名称“softappver []”所以当表单发布时，我把它作为一个数组。我想保持这种方式。

我喜欢至少检查一个复选框，否则它应该生成一条消息。

这是代码：

<script src="http://10.0.0.80/assets/js/jquery.js"></script>
<script src="http://10.0.0.80/assets/js/jquery.validate.js"></script>
<script>

jQuery.validator.addMethod( 
    "checkdropdown", 
    function(value, element) { 
        if (element.value == 0 || element.value == "#") { 
            return false; 
        } 
        else return true; 
    }, 
    "Please select an option." 
); 

$().ready(function() {  
    $("#jobform").validate({
        rules: {
            ptitle: {
                required: true,
                minlength: 2
            },

            vendor:{
               checkdropdown: true 
            },

            softwareapp:{
               checkdropdown: true 
            },



            softappver[]:{
               required: true,
            },


        },
        messages: {
            ptitle: "Please enter your job reference",          
            vendor: "Please select a vendor",
            softwareapp: "Please select a software",
            softappver: "Please select a application version"           

        }
    });
});
</script>

<form action="addeditprojectdetails" method="post" accept-charset="utf-8" class="jobform" id="jobform">
  Job reference :
  <input type="text" name="ptitle" value="" id="ptitle1"  />
  Primary role:
  <select name="primaryrole" id="primaryrole">
    <option value="0">Please select</option>
    <option value="1">Programme Manager</option>
    <option value="2">Project Manager</option>
    <option value="3">Test Manager</option>
    <option value="4">Business Analyst</option>
    <option value="5">Functional Consultant</option>
    <option value="6">Technical Architect</option>
    <option value="7">Data Migration Consultant</option>
    <option value="8">Test Analyst</option>
    <option value="9">Systems Tester</option>
    <option value="10">Analyst Programmer</option>
    <option value="11">Programmer</option>
    <option value="12">Systems Administrator</option>
    <option value="13">Trainer - Technical</option>
    <option value="14">Trainer - Functional</option>
    <option value="15">Technical Support</option>
  </select>
  Secondary role
  <select name="secondaryrole" id="secondaryrole">
    <option value="0">Please select</option>
    <option value="1">Programme Manager</option>
    <option value="2">Project Manager</option>
    <option value="3">Test Manager</option>
    <option value="4">Business Analyst</option>
    <option value="5">Functional Consultant</option>
    <option value="6">Technical Architect</option>
    <option value="7">Data Migration Consultant</option>
    <option value="8">Test Analyst</option>
    <option value="9">Systems Tester</option>
    <option value="10">Analyst Programmer</option>
    <option value="11">Programmer</option>
    <option value="12">Systems Administrator</option>
    <option value="13">Trainer - Technical</option>
    <option value="14">Trainer - Functional</option>
    <option value="15">Technical Support</option>
  </select>
  Vendor
  <select name="vendor" id="vendor">
    <option value="0">Please select</option>
    <option value="5">Microsoft</option>
    <option value="9">Apple</option>
    <option value="2">Oracle</option>
    <option value="7">Java</option>
  </select>
  Application
  <select name="softwareapp" id="softwareapp">
    <option value="0">Please select</option>
    <option value="2">OS</option>
    <option value="1">Development kit</option>
  </select>
  Versions
  <input type="checkbox" name="softappver[]" value="1" id="softappver" style="width:auto; max-width:auto;"  />  R4
  <input type="checkbox" name="softappver[]" value="8" id="softappver" style="width:auto; max-width:auto;"  />  R5
  <input type="checkbox" name="softappver[]" value="2" id="softappver" style="width:auto; max-width:auto;"  />  R6
  <input type="checkbox" name="softappver[]" value="3" id="softappver" style="width:auto; max-width:auto;"  />  R7
  <input type="checkbox" name="softappver[]" value="4" id="softappver" style="width:auto; max-width:auto;"  />  R8
  <input type="checkbox" name="softappver[]" value="5" id="softappver" style="width:auto; max-width:auto;"  />  R9  
  <input type="checkbox" name="softappver[]" value="6" id="softappver" style="width:auto; max-width:auto;"  />  R10
  <input type="checkbox" name="softappver[]" value="7" id="softappver" style="width:auto; max-width:auto;"  />  R11
</form>

Answer 1

问题是存在语法错误

        softappver[]: {
           required: true,
        },

应该是

        "softappver[]": {
           required: true,
        },

演示：Plunker

Answer 2

你真的不应该给那些复选框提供相同的ID。改为使用一个类：

<input type="checkbox" name="softappver[]" value="1" class="softappver" style="width:auto; max-width:auto;"  />  R4
<input type="checkbox" name="softappver[]" value="8" class="softappver" style="width:auto; max-width:auto;"  />  R5
etc...

然后使用这样的东西：

if ($(".softappver:checked").length < 1)
    alert("Please select at least one checkbox.");

jquery表单验证具有相同id和名称的多个复选框

2 个答案: