jQuery를 이용해 radio 버튼 유효성 검사 해보기.

위와 같은 그림이 있는데 -
직장/집 을 선택하면 주소를 넣어야하고, 수신거부를 선택하면 패스되는 유효성 검사를 해보려하는데 -

html을 이용한 for문을 사용한 것, jQuery를 이용하는 것 2가지를 비교해보면..

if(frm.p_addressGubun.length > 0){
	var b = 0; 
	for(var i=0; i<frm.p_addressGubun.length; i++){
		// 직장-집 일 경우
		if(frm.p_addressGubun[i].checked && frm.p_addressGubun[i].value != '3'){
			b = 1; break;
		// 수신거부일 경우
		}else if(frm.p_addressGubun[i].checked && frm.p_addressGubun[i].value == '3'){
			b = 2; break;
		}
	}
	if(b == 0){
		alert("주소 구분을 선택해 주세요. 주소가 없는 경우 수신거부를 선택하십시오.");
		 return false;
	}else if(b == 1 && frm.p_zipCode.value == ""){
		 alert("주소를 입력하세요. 주소가 없는 경우 수신거부를 선택하십시오.");
		 return false;
	}
	return true;
}

위 코드를 jQuery 코드로 바꾸면.. 아래와 같다..

if(frm.p_addressGubun.length > 0){
	if($j(':radio[name="p_addressGubun"]:checked').length < 1){
		alert("주소 구분을 선택해 주세요. 주소가 없는 경우 수신거부를 선택하십시오.");
		return false;
	}
	}else if($(':radio[name="p_addressGubun"]:checked').val() != 3 && frm.p_zipCode.value == ""){
		 alert("주소를 입력하세요. 주소가 없는 경우 수신거부를 선택하십시오.");
		 return false;
	}
	return true;
}

정말 간단해 진다..
:radio -> elements 중 radio 버튼 들
[name="elements_name"] -> elements_name 을 가진
합치면 :radio[name="p_addressGubun"] -> p_addressGubun 이름을 가진 radio 버튼을 선택한다.
:checked 선택된 것만.