본문 바로가기
이전글/2007

F함수의 radio 값 선택 불편함을 RF 함수로 날리기

by 물개선생 2007. 4. 17.
Prototype은 정말 굉장한 라이브러리다. 하지만 prototype을 사용해도 radio group에서 선택된 값을 알아내기는 여간 불편하지 않다. select/option의 선택값을 멋지게 찾아내는 F 함수가 아쉽게도 radio는 처리하지 못한다. 우아한 해결책을 찾다가 좋은 글을 발견.

"Using Prototype Javascript to get the value of a radio group"
http://xavisys.com/blog/2007/03/01/using-prototype-javascript-to-get-the-value-of-a-radio-group/


아래와 같이 쓰는 경우도 있지만,

var typeValue = Form.getInputs(’myform’,'radio’,'type’).find(function(radio) { return radio.checked; }).value;

xavisys.com에서 발견한 RF 함수가 깔끔하다. (흠. tistory에서 쓸만한 코드 플러그인은 언제쯤..)

/**
 * Returns the value of the selected radio button in the radio group
 * 
 * @param {radio Object} or {radio id} el
 * OR
 * @param {form Object} or {form id} el
 * @param {radio group name} radioGroup
 */
function $RF(el, radioGroup) {
	if($(el).type == 'radio') {
		var el = $(el).form;
		var radioGroup = $(el).name;
	} else if ($(el).tagName.toLowerCase() != 'form') {
		return false;
	}
	return $F($(el).getInputs('radio', radioGroup).find(
		function(re) {return re.checked;}
	));
}

이걸 찾다가 발견한 좋은 기사 2개도 같이 정리. 서버 측 validation도 유용하지만, 클라이언트 측에서 검증해야 할 것들이 분명히 있다. 스타일을 이용한 자동일괄검증 기법을 소개하는 2번째 기사는 매우 유용할 듯 싶다.

- Painless JavaScript Using Prototype By Dan Webb
http://www.sitepoint.com/article/painless-javascript-prototype
- Really easy field validation
http://tetlaw.id.au/view/javascript/really-easy-field-validation