다음을 통해 공유


연습: ASP.NET AJAX Extender 컨트롤

업데이트: 2007년 11월

ASP.NET AJAX Extender 컨트롤은 TextBox 컨트롤, Button 컨트롤 및 Panel 컨트롤 등의 ASP.NET 웹 서버 컨트롤의 클라이언트 기능을 향상시킵니다. Extender를 사용하면 사용자에게 다양한 웹 기반 환경을 제공할 수 있습니다. 이 연습에서는 Extender 컨트롤을 사용하여 ASP.NET Button 웹 서버 컨트롤의 기능을 향상시킵니다.

ASP.NET AJAX Extender 컨트롤을 Visual Studio에 추가하고 다른 컨트롤과 같은 방법으로 이 컨트롤을 사용할 수 있습니다. 고유한 Extender 컨트롤을 만들거나 다른 소스에서 가져올 수 있습니다.

Extender 컨트롤의 소스 중 하나는 ASP.NET AJAX Control Toolkit입니다. Control Toolkit에서는 사용자 지정 컨트롤과 Extender를 간단하게 만들고 다시 사용할 수 있게 해주는 샘플과 SDK를 제공합니다. ASP.NET AJAX Control Toolkit은 ASP.NET AJAX Control Toolkit 웹 사이트에서 다운로드할 수 있습니다.

중요:

Control Toolkit은 커뮤니티 지원 라이브러리이며 Microsoft에서 지원하지 않습니다. 이 항목에서는 Control Toolkit에 있는 Extender 컨트롤을 예로 들어 Extender 컨트롤 사용 방법을 보여 줍니다. 하지만 이 항목의 정보를 통해 여기서 설명하는 Extender 컨트롤이 ASP.NET의 공식적인 부분이라거나 지원되는 컨트롤이라는 의미로 해석해서는 안 됩니다.

Visual Studio 2008의 Extender 컨트롤에 대한 자세한 내용은 ASP.NET AJAX Extender 컨트롤 개요를 참조하십시오. ASP.NET AJAX Toolkit에 대한 자세한 내용은 ASP.NET AJAX Control Toolkit 웹 사이트를 참조하십시오.

사전 요구 사항

이 연습을 절차를 완료하려면 다음이 필요합니다.

  • Visual Studio 2008 또는 Microsoft Visual Web Developer Express Edition

  • ASP.NET AJAX Control Toolkit. Control Toolkit은 ASP.NET AJAX Control Toolkit 웹 사이트에서 다운로드할 수 있습니다.

웹 사이트 만들기

먼저 AJAX 기능을 사용할 수 있는 ASP.NET 웹 사이트를 만듭니다.

파일 시스템 웹 사이트를 만들려면

  1. Visual Studio 2008 또는 Microsoft Visual Web Developer Express Edition을 엽니다.

  2. 파일 메뉴에서 새 웹 사이트를 클릭합니다.

  3. 새 웹 사이트 대화 상자의 Visual Studio에 설치되어 있는 템플릿에서 ASP.NET 웹 사이트를 클릭합니다.

  4. 위치 상자에서 파일 시스템 확인란을 선택한 다음 웹 사이트의 페이지를 보관할 폴더의 이름을 입력합니다.

    예를 들어 C:\WebSite1이라는 폴더 이름을 입력합니다.

  5. 언어 목록에서 Visual Basic 또는 **Visual C#**을 클릭한 다음 확인을 클릭합니다.

    Visual Studio에서는 폴더를 만들고 Default.aspx라는 새 웹 페이지를 소스 뷰에서 엽니다.

AJAX Extender 컨트롤 추가

ASP.NET AJAX Control Toolkit에는 웹 서버 컨트롤의 클라이언트 기능을 확장하는 데 사용할 수 있는 여러 Extender 컨트롤이 포함되어 있습니다.

참고:

다음 절차에서 서버 컨트롤에 Extender 컨트롤을 추가하기 전에 ASP.NET AJAX Toolkit을 설치해야 합니다. Control Toolkit은 ASP.NET AJAX Control Toolkit 웹 사이트에서 다운로드할 수 있습니다.

AJAX Extender 컨트롤을 추가하려면

  1. 디자인 뷰로 전환합니다.

  2. 페이지에 ScriptManager 컨트롤이 아직 포함되어 있지 않은 경우 도구 상자AJAX 확장 탭에서 컨트롤을 페이지로 끌어다 놓습니다.

    참고:

    AJAX 기능을 지원하려면 ScriptManager 컨트롤이 필요합니다.

  3. 도구 상자표준 탭에서 Button 컨트롤을 페이지로 끕니다.

  4. 단추 작업 바로 가기 메뉴가 나타나지 않으면 Button 컨트롤을 마우스 오른쪽 단추로 클릭하고 스마트 태그 표시를 클릭합니다.

  5. 단추 작업 메뉴에서 Extender 추가를 클릭합니다.

  6. Extender 마법사Button1에 추가할 기능 선택 목록에서 ConfirmButtonExtender를 클릭한 다음 확인을 클릭합니다.

    참고:

    도구 상자에서 Extender 컨트롤을 Button 컨트롤로 직접 끌어와 추가할 수도 있습니다.

  7. 속성 창에서 Extender 탭을 확장한 다음 Button1_ConfirmButtonExtender를 확장합니다.

  8. ConfirmText 속성을 Continue?로 설정합니다.

Extender 컨트롤 테스트

이제 페이지를 실행하여 Extender 컨트롤을 테스트할 수 있습니다.

Extender 컨트롤을 테스트하려면

  1. Ctrl+F5를 눌러 브라우저에서 페이지를 실행합니다.

  2. 페이지에 추가한 단추를 클릭합니다.

    확인 메시지 상자가 표시됩니다. 이 동작은 Extender 컨트롤에서 추가한 동작입니다.

  3. 브라우저를 닫습니다.

AJAX Extender 컨트롤 제거

Extender 컨트롤의 기능이 더 이상 필요하지 않으면 Extender 컨트롤을 제거할 수 있습니다.

AJAX Extender 컨트롤을 제거하려면

  1. 디자인 뷰로 전환합니다.

  2. Button 컨트롤을 선택한 다음 단추 작업 메뉴에서 Extender 제거를 클릭합니다.

  3. Button1에 연결된 extender 목록에서 ConfirmButtonExtender를 선택합니다.

  4. 제거를 클릭한 다음 확인을 클릭합니다.

참고 항목

개념

ASP.NET AJAX Extender 컨트롤 개요