Aquí está mi lista de casillas de verificación y el botón que necesito para enviar los datos.

 <label>Access Locations </label> <br /> <input type="checkbox" name="chk[]" id="check1" class="pl" value="INT" /> dummy1 <input type="checkbox" name="chk[]" id="check2" class="pl" value="MV" /> dummy2 <input type="checkbox" name="chk[]" id="check3" class="pl" value="FV" /> dummy3 <input type="checkbox" name="chk[]" id="check4" class="pl" value="PS" /> dummy4 <br /> <h4 name ="checkboxvalues" style="color:green" id="result_checkbox"></h4> <input type="hidden" name="employee_id_update" id="employee_id_update" /> <input onclick="getCheckboxValue()" type="submit" name="insert" id="insert" value="Update" class="btn btn-success" />

Estoy usando la siguiente clase cuando se hace clic en el botón.

 function getCheckboxValue() { var l1 = document.getElementById("check1"); var l2 = document.getElementById("check2"); var l3 = document.getElementById("check3"); var l4 = document.getElementById("check4"); var res=" "; if (l1.checked == true){ var pl1 = document.getElementById("check1").value; res = pl1 + ","; } else if (l2.checked == true ){ var pl2 = document.getElementById("check2").value; res = res + pl2 + ","; } else if (l3.checked == true){ document.write(res); var pl3 = document.getElementById("check3").value; res = res + pl3 + ","; } else if (l4.checked == true){ var pl4 = document.getElementById("check4").value; res = res + pl4 + ","; } return document.getElementById("result_checkbox").innerHTML = "You have selected " + res ; }

Desde el método anterior, solo pude ver un valor en los valores de la checkboxvalues de verificación como en la imagen cuando se hizo clic en el botón, aunque he marcado varias casillas de verificación.

¿Alguien puede mostrarme cómo mejorar mi código para mostrar todos los valores cuando marqué varias casillas de verificación?

Si la salida seleccionada check1 y check2 debe ser

Producción:

 You have selected INT,MV