체크박스 전체 선택하기

   체크박스 여부의 확인

1.id

$("input:checkbox[id='ID']").is(":checked"); // 결과 true, false

2.name

$("input:checkbox[name='NAME']").is(":checked"); // 결과 true, false

3. attr

$("#btnDelToggle").attr("checked") || false;  //결과 checked, false (이유: undefinded의 기본값을 false로 부여 해서)

 

    체크처리

1. id

$("input:checkbox[id='ID']").attr("checked", true);

2.name

$("input:checkbox[name='NAME']").attr("checked", false);

3. 배열[]

$("input:checkbox[name='modifyChk[]']:checkbox").echo(function(){

    $(this).attr("checked", true); //true,false

});

배열을 form으로 조금만 더 응용 해 보면 아래와 같다.

$("form[name='frm']").find("input:checkbox[name='modifyChk[]']:checkbox").echo(function(){

    $(this).attr("checked", true); //true,false

});

    권장하는 솔루션 3개

<form name='frm' method='post' action='#'>
	<input type='hidden' id='prmNumAdId' name='prmNumAdId' value='4' />

	<table>
		<tr>
			<td>전체<span style='position:relative; top:2px;'>
			<input id='btnDelToggle' type='checkbox' value='1' />
			</span>
			</td>
		</tr>

		<tr>
			<td><input type=checkbox name=prmAdId0 id=prmAdId0 value='392' /></td>
		</tr>
		<tr>
			<td><input type=checkbox name=prmAdId1 id=prmAdId1 value='392' /></td>
		</tr>
		<tr>
			<td><input type=checkbox name=prmAdId2 id=prmAdId2 value='392' /></td>
		</tr>
		<tr>
			<td><input type=checkbox name=prmAdId3 id=prmAdId3 value='392' /></td>
		</tr>
	</table>
</form>


<script type="text/javascript">
	$(document).ready(function(){
		//
		$("#btnDelToggle").click(function () {
			var bChk = $("#btnDelToggle").attr("checked") || false;
			console.log(bChk);
			var nNumAdId = $("#prmNumAdId").val();
			var nI;
			for (nI = 0; nI < nNumAdId; nI++) {
				if ( !$("#prmAdId" + nI).attr("disabled") )$("#prmAdId" + nI).attr("checked", bChk);
			}
		});
</script>

<!--///////////////////////////////////////////////////////////////////////////////////////////////-->

<form name='frm' method='post' action='#'>
	<table>
		<tr>
			<td>전체<span style='position:relative; top:2px;'>
			<input id='check_all' type='checkbox' value='1' />
			</span>
			</td>
		</tr>

		<tr>
			<td><input type=checkbox name=modifyChk[] value='392' /></td>
		</tr>
		<tr>
			<td><input type=checkbox name=modifyChk[] value='392' /></td>
		</tr>
		<tr>
			<td><input type=checkbox name=modifyChk[] value='392' /></td>
		</tr>
		<tr>
			<td><input type=checkbox name=modifyChk[] value='392' /></td>
		</tr>
	</table>
</form>

<script type="text/javascript">
	$(document).ready(function(){
		//
		var frm = $("form[name='frm']");
		$("#check_all").click(function(){ 
			var chk = $(this).is(":checked");//.attr('checked');
			if(chk){
				frm.find("input:checkbox[name='modifyChk[]']:checkbox").each(function(){
					$(this).attr("checked",true);
				});
			}else{
				frm.find("input:checkbox[name='modifyChk[]']:checkbox").each(function(){
					$(this).attr("checked",false);
				});
			}
		});
	});
</script>

<!--///////////////////////////////////////////////////////////////////////////////////////////////-->

<form name='frm' method='post' action='#'>
	<table>
		<tr>
			<td>전체<span style='position:relative; top:2px;'>
			<input id='select_all' type='checkbox' value='1' />
			</span>
			</td>
		</tr>

		<tr>
			<td><input type=checkbox class='select' name='class[1]' value='392' /></td>
		</tr>
		<tr>
			<td><input type=checkbox class='select' name='class[2]' value='392' /></td>
		</tr>
		<tr>
			<td><input type=checkbox class='select' name='class[3]' value='392' /></td>
		</tr>
		<tr>
			<td><input type=checkbox class='select' name='class[4]' value='392' /></td>
		</tr>
	</table>
</form>


<script type="text/javascript">
	$(document).ready(function(){
//
		$("#select_all").click(function(){ 
			var chk = $(this).is(":checked");//.attr('checked');
			if(chk) $(".select").attr('checked', true);
			else $(".select").attr('checked', false);
		 });

	});
</script>

    결과