复选框全选php javascript

我制作了一个脚本，以便为表单中的项目创建一个全选选项。复选框全选php javascript

<script> 
     function Check(frm){ 
     var checkBoxes = frm.elements['patients[]']; 

     for (i = 0; i < checkBoxes.length; i++){ 
      checkBoxes[i].checked = (checkBoxes[i].checked != true) ? true : false; 
     } 

     } 

     window.onload = function(){ 
      document.getElementById("selectpatient").onchange = function(){Check(document.selectform)}; 
     }; 
</script>

这适用于以下示例代码。

<body> 
<form name="selectform" method="" action=""> 
<label for="red">Red</label> 
<input type="checkbox" name="patients[]" value="red" id="red"/><br /> 

<label for="blue">Blue</label> 
<input type="checkbox" name="patients[]" value="blue" id="blue"/><br /> 

<label for="green">Green</label> 
<input type="checkbox" name="patients[]" value="green" id="green"/><br /> 

<label for="black">Black</label> 
<input type="checkbox" name="patients[]" value="black" id="black"/><br /><br /> 

<label for="selectall" id="selectControl">Select All</label> 
<input type="checkbox" id="selectall" /> 
</form> 

<script> 
function Check(frm){ 
var checkBoxes = frm.elements['patients[]']; 

for (i = 0; i < checkBoxes.length; i++){ 
checkBoxes[i].checked = (checkBoxes[i].checked != true) ? true : false; 
} 

} 

window.onload = function(){ 
document.getElementById("selectall").onchange = function() Check(document.selectform)}; 
}; 
</script> 
</body>

不过，我在我试图运行的代码，以便能够从database.The腓段选择项目如下：一个独立的PHP代码。

  <div class="row"><form name="selectform" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']);?>" method="post"> 
     <div class="box clearfix"> 
     <table class="table" > 
      <thead> 
      <tr> 
       <th><input type="checkbox" id='selectall' ></th> 

       <th>First Name</th> 
       <th>Last Name</th> 
       <th>NIC</th> 
       <th>Address</th> 

       <th>Telephone/Mobile</th> 
       <th>Disability</th> 
       <th>Reason</th> 
       <th>Description</th> 
       <th></th> 
      </tr> 
      </thead> 
      <tbody> 
      <?php 
       while ($data = $res->fetch_assoc()){ 
        echo "<tr><td><input type='checkbox' name='patients[]' id='patients[]' value='".$data['PatientID']."'></td><td>".$data['First_Name']."</td><td>".$data['Last_Name']."</td><td>".$data['NIC_No']."</td><td>".$data['Address']."</td><td>".$data['Telephone']."</td><td>".$data['Disability']."</td><td>".html_entity_decode($data['Reason'])."</td><td>".html_entity_decode($data['Description'])."</td>"; 
       } 
      ?> 
      </tbody> 
     </table> 
    </div> 

       </form> 
       <script> 
         function Check(frm){ 
         var checkBoxes = frm.elements['patients[]']; 

         for (i = 0; i < checkBoxes.length; i++){ 
          checkBoxes[i].checked = (checkBoxes[i].checked != true) ? true : false; 
         } 

         } 

         window.onload = function(){ 
          document.getElementById("selectall").onchange = function(){Check(document.selectform)}; 
         }; 
        </script> 

    </div>

上述代码不执行select all脚本。请建议我可以做些什么来实现这一功能。

来源

2016-02-17 Kavinda Keshan Rasnayake

看来你缺少onchange回调{：

function Check(frm) { 
 
    var checkBoxes = frm.elements['patients[]']; 
 

 
    for (i = 0; i < checkBoxes.length; i++) { 
 
    checkBoxes[i].checked = (checkBoxes[i].checked != true) ? true : false; 
 
    } 
 

 
} 
 

 
window.onload = function() { 
 
    document.getElementById("selectall").onchange = function() { // <--missing { here 
 
    Check(document.selectform) 
 
    }; 
 
};

<form name="selectform" method="" action=""> 
 
    <label for="red">Red</label> 
 
    <input type="checkbox" name="patients[]" value="red" id="red" /> 
 
    <br /> 
 

 
    <label for="blue">Blue</label> 
 
    <input type="checkbox" name="patients[]" value="blue" id="blue" /> 
 
    <br /> 
 

 
    <label for="green">Green</label> 
 
    <input type="checkbox" name="patients[]" value="green" id="green" /> 
 
    <br /> 
 

 
    <label for="black">Black</label> 
 
    <input type="checkbox" name="patients[]" value="black" id="black" /> 
 
    <br /> 
 
    <br /> 
 

 
    <label for="selectall" id="selectControl">Select All</label> 
 
    <input type="checkbox" id="selectall" />

或者你也可以简化这个更多的是：

function Check(frm, ischecked) { 
 
    var checkBoxes = frm.elements['patients[]']; 
 

 
    for (i = 0; i < checkBoxes.length; i++) { 
 
    checkBoxes[i].checked = ischecked; // and just update for all here 
 
    } 
 

 
} 
 

 
window.onload = function() { 
 
    document.getElementById("selectall").onchange = function() { // <--missing { here 
 
    Check(document.selectform, this.checked); // <----pass the state here 
 
    }; 
 
};

<form name="selectform" method="" action=""> 
 
    <label for="red">Red</label> 
 
    <input type="checkbox" name="patients[]" value="red" id="red" /> 
 
    <br /> 
 

 
    <label for="blue">Blue</label> 
 
    <input type="checkbox" name="patients[]" value="blue" id="blue" /> 
 
    <br /> 
 

 
    <label for="green">Green</label> 
 
    <input type="checkbox" name="patients[]" value="green" id="green" /> 
 
    <br /> 
 

 
    <label for="black">Black</label> 
 
    <input type="checkbox" name="patients[]" value="black" id="black" /> 
 
    <br /> 
 
    <br /> 
 

 
    <label for="selectall" id="selectControl">Select All</label> 
 
    <input type="checkbox" id="selectall" />

来源

2016-02-17 09:23:47 Jai

谢谢你，但我对第三代代码更感兴趣，它没有按预期运行。我应该附上完整的代码吗？ –

@Adniwhack可能是应用了相同ID的情况，您可以为其使用uqique ids或将prop ID更改为class。 – Jai

复选框全选php javascript

回答

相关问题