mercredi 17 novembre 2021

How to get multiple checkbox values with loop in javascript?

I am trying to get selected checkbox values under different categories,if it is checked. I have code below:

   <table>
                <tr>
                    <th colspan="2">Part A</th>
                    <th colspan="2">Part B</th>
                </tr>
                <tr>
                    <td >
                        <input class="checkbox" type="checkbox" id="chkbox_a1" name="PartA"></td>
                    <td  class="style6">A1</td>
                    <td >
                        <input  class="checkbox" type="checkbox" id="chkbox_b1" name="PartB"></td>
                    <td class="style6" >B1</td>
                </tr>
                 <tr>
                    <td >
                        <input class="checkbox" type="checkbox" id="chkbox_a2" name="PartA"></td>
                    <td  class="style6">A2</td>
                    <td >
                        <input  class="checkbox" type="checkbox" id="chkbox_b2" name="PartB"></td>
                    <td class="style6" >B2</td>
                </tr>
                 <tr>
                    <td >
                        <input class="checkbox" type="checkbox" id="chkbox_a3" name="PartA"></td>
                    <td  class="style6">A3</td>
                    <td >
                        <input  class="checkbox" type="checkbox" id="chkbox_b3" name="PartB"></td>
                    <td class="style6" >B3</td>
                </tr>
                 <tr>
                    <td >
                        <input class="checkbox" type="checkbox" id="chkbox_a4" name="PartA"></td>
                    <td  class="style6">A4</td>
                    <td >
                        <input  class="checkbox" type="checkbox" id="chkbox_b4" name="PartB"></td>
                    <td class="style6" >B4</td>
                </tr>                
</table>

and javascriot code as follows:

<script type="text/javascript">
    function save() {        
        var checkboxPartA;
        var checkboxPartB;
        var ChkboxPartA_value = document.getElementsByName('PartA');        
        for (var checkbox in ChkboxPartA_value) {
            if (checkbox.checked)
                checkboxPartA = checkbox.value.append(checkbox.value + ' , ');            
        }
        
         var ChkboxPartB_value = document.getElementsByName('PartB');      
        for (var checkbox1 in ChkboxPartB_value) {
            if (checkbox1.checked)
                checkboxPartB = checkbox1.value.append(checkbox.value + ' , ');            
        }
    }
    </script>

My sample image aas follows: enter image description here

Some how, my code is not working, function triggered, but it doesn't return any value for the checkbox.

(As of now, Im checking whether I can get all checkbox values or not only before saving, but I didn't get any values.)

Kindly help to fix this issue.




Aucun commentaire:

Enregistrer un commentaire