複数あるチェックボックスを4個までに制限する

忙しいときは書けない、、、

複数あるチェックボックスを4つまで選択可能にし、4つ超えると警告を出し、最後に選択したチェックを外します。

 

<script>
function checkIDset(hitID){
	const idArr = [];
	const id_tag = document.getElementsByName("checkID");

	for (let i = 0; i < id_tag.length; i++){
		if(id_tag[i].checked){ //(color2[i].checked === true)と同じ
            
            if(idArr.length > 3){
                //警告出す
                alert('4人以上は選択できません');
                //最後に選択したIDのチェックを外す
                const rmvTag = document.getElementById(hitID);
                rmvTag.checked = false;
            }else{
                idArr.push(id_tag[i].id);
            }
		}
	}
    
 
}
</script>

 

 

PHP部分

<?php 
                            echo '<div class="input-group m-1 p-0"><div class="input-group-prepend"><div class="input-group-text p-1"><input type="checkbox" onchange="checkIDset('.$value['id'].')" name = "checkID" id="'. $value['id'] . '"></div></div><span class="form-control"><label for="'. $value['id'] . '"><span class="badge badge-primary">本人</span><span style="font-size:0.9rem;">' .  $value['name'] . 'さん</span></span></label></div>'; 
                            ?>