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

我正在使用jQuery表单验证。我有一组从数据库生成的复选框。jquery表单验证具有相同ID和名称的多个复选框

复选框具有相同的名称和相同的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>

来源

2013-06-13 Farid Siddiqui

使用相同的类名称而不是具有相同名称的ID。 –

关键'softappver []'无效使用''softappver []''改为 –

你真的不应该给这些复选框相同的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.");

来源

2013-06-13 09:23:42

的问题是有一个语法错误

 softappver[]: { 
      required: true, 
     },

应该

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

演示：Plunker

来源

2013-06-13 09:26:02

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

回答

相关问题