RadioButton 및 RadioButtonList 웹 서버 컨트롤 개요

Visual Studio 2010

업데이트: 2007년 11월

RadioButton 컨트롤 및 RadioButtonList 컨트롤을 사용하면 함께 사용할 수 없는 미리 정의된 일련의 선택 옵션에서 항목을 선택하도록 할 수 있습니다.

이 항목의 내용은 다음과 같습니다.

CheckBox 컨트롤 및 CheckBoxList 컨트롤을 사용하여 다음을 수행할 수 있습니다.

  • 라디오 단추를 선택할 때 페이지 포스트백 발생

  • 사용자가 라디오 단추를 선택할 때 사용자 상호 작용 캡처

  • 각 라디오 단추를 데이터베이스의 데이터에 바인딩

맨 위로 이동

두 유형의 웹 서버 컨트롤, 즉 개별 RadioButton 컨트롤 또는 RadioButtonList 컨트롤을 사용하여 ASP.NET 웹 페이지에 라디오 단추를 추가할 수 있습니다. 두 컨트롤 모두 함께 사용할 수 없는 미리 정의된 일련의 선택 옵션에서 사용자가 항목을 선택하도록 할 수 있으며 레이블이 있는 라디오 단추를 개수에 관계없이 정의하고 이를 가로 또는 세로로 정렬할 수 있도록 합니다.

개별 RadioButton 컨트롤의 경우 페이지에 추가한 다음 단독으로 사용합니다. 대개 두 개 이상의 개별 단추를 그룹으로 함께 묶어 사용합니다.

또는 라디오 단추 목록 항목의 컬렉션에 대해 부모 컨트롤 역할을 수행하는 단일 컨트롤인 RadioButtonList 컨트롤을 사용할 수 있습니다. 이 컨트롤은 기본 ListControl 클래스에서 파생됩니다. 따라서 ListBox, DropDownList, BulletedListCheckBoxList 웹 서버 컨트롤과 매우 유사하게 작동합니다. RadioButtonList 컨트롤을 사용하는 대부분의 프로시저는 다른 List 웹 서버 컨트롤을 사용하는 프로시저와 같습니다.

두 컨트롤 형식 모두 장점이 있습니다. 개별 RadioButton 컨트롤을 사용하면 RadioButtonList 컨트롤을 사용하는 것보다 라디오 단추 그룹의 레이아웃을 더욱 정밀하게 제어할 수 있습니다. 예를 들어 라디오 단추 사이에 라디오 단추용이 아닌 텍스트를 넣을 수 있습니다.

RadioButtonList 컨트롤은 데이터 소스의 데이터를 기반으로 라디오 단추 그룹을 만들 경우에 매우 효과적입니다. 선택된 단추를 확인하는 코드를 쓰기도 쉽습니다.

b3se8ewc.alert_note(ko-kr,VS.100).gif참고:

HtmlInputRadioButton 서버 컨트롤을 사용하여 ASP.NET 웹 페이지에 라디오 단추를 추가할 수도 있습니다. 자세한 내용은 HtmlInputRadioButton 서버 컨트롤 선언 구문을 참조하십시오.

더 긴 옵션 목록이나 런타임에 길이가 달라질 수 있는 목록을 제공하려면 ListBox 또는 DropDownList 웹 서버 컨트롤을 사용합니다.

라디오 단추 그룹화

라디오 단추는 대개 단독으로 사용하지 않는 대신 그룹화하여 상호 배타적인 옵션 집합을 제공하는 데 사용합니다. 그룹 안의 라디오 단추는 한 번에 하나만 선택할 수 있습니다. 다음과 같은 방법으로 라디오 단추를 그룹화할 수 있습니다.

  • 개별 RadioButton 웹 서버 컨트롤을 페이지에 추가한 다음 전체를 수동으로 한 그룹에 할당합니다. 그룹 이름은 임의적으로 그룹 이름이 같은 모든 라디오 단추는 하나의 그룹에 속하는 것으로 간주됩니다.

  • RadioButtonList 웹 서버 컨트롤을 페이지에 추가합니다. 컨트롤의 목록 항목이 자동으로 그룹화됩니다.

RadioButton 및 RadioButtonList 이벤트

개별 RadioButton 컨트롤과 RadioButtonList 컨트롤에 대한 이벤트는 다소 다르게 동작합니다.

개별 RadioButton 컨트롤

개별 RadioButton 컨트롤을 클릭하면 CheckedChanged 이벤트가 발생합니다. 이 이벤트는 CheckBox 컨트롤에서 상속됩니다. 기본적으로 이 이벤트로 인해 페이지가 서버로 게시되지는 않습니다. 그러나 AutoPostBack 속성을 true로 설정하여 컨트롤이 즉시 포스트백을 수행하도록 강제 적용할 수 있습니다. 이 이벤트에 즉시 응답하는 방법에 대한 자세한 내용은 방법: RadioButton 웹 서버 컨트롤 그룹의 사용자 선택에 응답을 참조하십시오.

b3se8ewc.alert_note(ko-kr,VS.100).gif참고:

자동 포스트백 기능을 사용하려면 브라우저에서 ECMAScript(Jscript 또는 JavaScript)를 지원하고 사용자 브라우저에 이 스크립트가 활성화되어 있어야 합니다.

CheckedChanged 이벤트에 대한 이벤트 처리기를 만들어야 할 수도 있습니다. 페이지의 일부분으로 실행되는 코드에서 선택된 라디오 단추를 테스트할 수 있습니다. 일반적으로 현재 선택한 항목을 읽는 것만이 아니라 라디오 단추가 변경되었음을 알아야 할 경우에만 CheckedChanged 이벤트에 대한 이벤트 처리기를 만듭니다. 자세한 내용은 방법: RadioButton 웹 서버 컨트롤의 선택 설정 및 가져오기를 참조하십시오.

RadioButtonList 컨트롤

RadioButtonList 컨트롤은 사용자가 목록에서 다른 라디오 단추를 선택하여 변경할 때 SelectedIndexChanged 이벤트를 발생시킵니다. 기본적으로 이 이벤트로 인해 페이지가 서버로 게시되지는 않습니다. 그러나 AutoPostBack 속성을 true로 설정하여 컨트롤이 즉시 포스트백을 수행하도록 강제 적용할 수 있습니다. 자세한 내용은 방법: List 웹 서버 컨트롤의 변경 내용에 응답을 참조하십시오.

b3se8ewc.alert_note(ko-kr,VS.100).gif참고:

자동 포스트백 기능을 사용하려면 브라우저에서 ECMAScript(Jscript 또는 JavaScript)를 지원하고 사용자 브라우저에 이 스크립트가 활성화되어 있어야 합니다.

개별 RadioButton 컨트롤의 경우와 같이 일반적으로 페이지가 다른 방법으로 게시된 다음 RadioButtonList 컨트롤의 상태를 테스트합니다. 자세한 내용은 방법: List 웹 서버 컨트롤의 선택 확인을 참조하십시오.

RadioButton 컨트롤 HTML 특성

RadioButton 컨트롤은 브라우저의 두 부분, 즉 라디오 단추를 나타내는 input 요소와 라디오 단추의 캡션을 나타내는 개별 label 요소를 렌더링합니다. 그런 다음 이 두 요소의 조합이 span 요소에 래핑됩니다.

스타일 또는 특성 설정을 RadioButton 컨트롤에 적용하면 외부 span 요소에 적용됩니다. 예를 들어 컨트롤의 BackColor 속성을 설정하면 설정이 span 요소에 적용됩니다. 따라서 내부 inputlabel 요소 모두에 영향을 줍니다.

따라서 라디오 단추와 레이블을 개별적으로 설정할 수도 있습니다. RadioButton 컨트롤은 런타임에 설정할 수 있는 두 속성을 지원합니다. InputAttributes 속성은 HTML 특성을 input 요소에 추가할 수 있도록 하고, LabelAttributes 속성은 HTML 특성을 label 요소에 추가할 수 있도록 합니다. 설정하는 특성은 원래 상태로 브라우저에 전달됩니다. 다음 예제에서는 마우스 포인터를 대면 레이블이 아닌 라디오 단추의 색만 변하도록 input 요소의 특성을 설정하는 방법을 보여 줍니다.

RadioButton1.InputAttributes.Add("onmouseover", 
    "this.style.backgroundColor = 'red'");
RadioButton1.InputAttributes.Add("onmouseout", 
    "this.style.backgroundColor = 'white'");

컨트롤에 데이터 바인딩

개별 RadioButton 컨트롤을 데이터 소스에 바인딩하고, RadioButton 컨트롤의 모든 속성을 데이터 소스의 모든 필드에 바인딩할 수 있습니다. 예를 들어 데이터베이스의 정보를 기반으로 컨트롤의 Text 속성을 설정할 수 있습니다.

라디오 단추는 그룹으로 사용되기 때문에 일반적으로 단일 라디오 단추를 데이터 소스에 바인딩하지는 않습니다. 대신 대개 RadioButtonList 컨트롤을 데이터 소스에 바인딩합니다. 이 경우 데이터 소스는 데이터 소스의 각 레코드에 대한 라디오 단추(목록 항목)를 동적으로 생성합니다.

맨 위로 이동

다음 표에서는 RadioButtonRadioButtonList 컨트롤과 관련된 클래스를 보여 줍니다.

멤버

설명

RadioButton

RadioButton 컨트롤의 기본 클래스입니다.

RadioButtonList

RadioButtonList 컨트롤의 기본 클래스입니다.

ListItem

RadioButtonList 컨트롤의 각 항목을 나타내는 클래스입니다.

Items

RadioButtonList 컨트롤에 대해 목록의 개별 항목에 해당하는 항목 컬렉션입니다.

맨 위로 이동

표시: