연습: 기존 웹 사이트에 Dynamic Data 추가

업데이트: 2008년 7월

이 연습에서는 Dynamic Data 프레임워크 기능을 포함하도록 기존 ASP.NET 웹 사이트를 수정하는 방법을 보여 줍니다. 또한 Dynamic Data 웹 사이트를 사용자 지정하는 방법도 설명합니다. 이 연습을 마치면 데이터 모델을 사용하여 데이터베이스와 상호 작용하는 기능적인 웹 사이트를 만들 수 있으며, 표시 및 편집을 위해 데이터 필드가 렌더링되는 방식을 정의하는 사용자 지정 필드 템플릿도 얻을 수 있습니다.

ASP.NET Dynamic Data의 가장 특징적인 측면은 데이터베이스를 나타내는 데이터 모델에서 데이터 필드의 모양과 동작을 런타임에 유추할 수 있다는 점입니다. 유추된 정보는 필드 템플릿을 통해 데이터 컨트롤에 사용되므로 프레젠테이션 계층에서 코드를 반복할 필요가 없습니다.

이 연습에서는 최소한의 코드만으로 다음 작업을 수행하는 방법을 보여 줍니다.

• 데이터 모델과의 상호 작용. Dynamic Data는 CRUD(만들기, 읽기, 업데이트 및 삭제) 작업을 수행할 수 있는 데이터 기반 응용 프로그램을 만드는 데 필요한 기능을 제공합니다.

• 필드 템플릿을 만들어 데이터 필드 표시 및 편집 방법 사용자 지정. Dynamic Data는 데이터 모델에서 유추한 정보를 기반으로 적절한 필드 템플릿을 선택합니다.

작업 진행 과정은 다음과 같습니다.

• 웹 사이트를 만든 다음 Dynamic Data를 지원하도록 웹 사이트를 수정합니다. 이 작업의 주 목표는 데이터베이스와의 상호 작용을 위해 Dynamic Data에 사용될 데이터 모델을 만드는 것입니다.

• 필드 템플릿을 만듭니다. 필드 템플릿은 데이터를 표시 및 편집하기 위한 UI를 정의하는 사용자 정의 컨트롤입니다.

• 테이블을 표시할 사용자 지정 페이지를 만듭니다. 이 페이지에서는 Dynamic Data가 데이터베이스와 상호 작용하는 방법과 이 작업에 최소한의 코드만 필요하다는 것을 알 수 있습니다.

• Dynamic Data 통합을 테스트합니다. 테스트를 통해 Dynamic Data의 기능이 웹 사이트에 통합되었는지 확인할 수 있습니다. 또한 데이터 모델과 상호 작용할 수 있으며 응용 프로그램이 예상대로 작동하는지 확인할 수 있습니다. 이 프로세스를 수행하면서 오류를 만들어 보고 처리해 봅니다.

사전 요구 사항

이 항목의 예제를 완료하려면 다음이 필요합니다.

• Microsoft Visual Studio 2008 서비스 팩 1 또는 Visual Web Developer 2008 Express Edition 서비스 팩 1

• AdventureWorksLT 샘플 데이터베이스. SQL Server 샘플 데이터베이스를 다운로드 및 설치하는 방법에 대한 자세한 내용은 CodePlex 사이트의 Microsoft SQL Server Product Samples: Database를 참조하십시오. 실행 중인 SQL Server 버전(Microsoft SQL Server 2005 또는 Microsoft SQL Server 2008)에 맞는 올바른 샘플 데이터베이스 버전을 설치해야 합니다.

Dynamic Data 웹 사이트 만들기

이 단원에서는 Visual Studio에서 Dynamic Data 웹 사이트를 만듭니다. 먼저 표준 ASP.NET 웹 사이트로 시작해서 Dynamic Data 기능을 지원하는 사이트로 변환합니다. 이렇게 하려면 다음을 수행합니다.

• ASP.NET 웹 사이트를 만듭니다.

• 데이터베이스에 사이트를 연결합니다. 이 데이터베이스에는 사용자 지정 표시 및 편집을 위해 액세스할 열(데이터 필드)이 있는 테이블이 포함되어 있습니다.

• Dynamic Data 컨트롤을 사용하도록 사이트를 구성합니다. 이렇게 하면 Dynamic Data 기능을 웹 사이트에 통합할 수 있습니다.

그런 다음 사용할 데이터 모델을 만들고 구성합니다. 다음 작업을 수행합니다.

• SQL Server 데이터베이스에 기반을 둔 데이터 모델 클래스를 만듭니다.

• 사용자 입력에 대해 사용자 지정 유효성 검사를 수행하고 나중에 Calendar 컨트롤을 사용하여 데이터 필드를 수정할 수 있도록 메타데이터를 데이터 모델에 추가합니다.

Dynamic Data를 사용할 수 있도록 웹 사이트 준비

이 단원에서는 ASP.NET 웹 사이트를 만들어 데이터베이스를 추가하고 Dynamic Data 기능을 사용할 수 있도록 웹 사이트를 구성하는 방법을 보여 줍니다.

ASP.NET 웹 사이트를 만들려면

1. Visual Studio를 시작합니다.

2. 파일 메뉴에서 새로 만들기를 클릭한 다음 웹 사이트를 클릭합니다.

   새 웹 사이트 대화 상자가 나타납니다.

3. Visual Studio에 설치되어 있는 템플릿에서 ASP.NET 웹 사이트를 선택합니다.

4. 위치 옆에서 파일 시스템을 선택하고 두 번째 상자에 웹 사이트의 페이지를 보관할 폴더의 이름을 입력합니다. 예를 들어 폴더 이름으로 C:\WebSites\DynamicDataWebSite를 입력합니다.

5. 언어 목록에서 작업할 프로그래밍 언어를 선택합니다.

6. 확인을 클릭합니다.

   Visual Studio에서 ASP.NET 웹 사이트용 폴더와 파일이 만들어집니다.

다음 단계에서는 사이트에 데이터베이스를 추가합니다. 이 데이터베이스에는 표시 및 편집을 위해 액세스할 열(데이터 필드)이 있는 테이블이 포함되어 있습니다.

웹 사이트에 데이터베이스를 추가하려면

1. 솔루션 탐색기에서 App_Data 폴더를 마우스 오른쪽 단추로 클릭한 다음 기존 항목 추가를 클릭합니다.

2. 기존 항목 추가 대화 상자에서 AdventureWorksLT 데이터베이스 파일(AdventureWorksLT.mdf)을 설치한 위치를 입력한 다음 추가를 클릭합니다.

   이렇게 하면 데이터베이스 파일의 복사본이 프로젝트에 만들어집니다.

이제 Dynamic Data 기능을 사용할 수 있도록 웹 사이트를 구성할 수 있습니다.

웹 사이트를 구성하려면

1. 솔루션 탐색기에서 Web.config 파일을 엽니다.

2. 다음 어셈블리에 대한 어셈블리 참조를 추가합니다.

   • System.Web.Routing

   • System.Web.DynamicData

   • System.ComponentModel.DataAnnotations

   다음 예제에서는 어셈블리를 추가하는 방법을 보여 줍니다. 올바른 어셈블리 버전을 사용해야 합니다.

   <system.web>
     <compilation>
       <assemblies>
   
         <add assembly="System.Web.Routing, Version=3.5.0.0,            Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>      <add assembly="System.Web.DynamicData, Version=3.5.0.0,            Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>      <add assembly="System.ComponentModel.DataAnnotations,            Version=3.5.0.0,            Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
       </assemblies>
     </compilation>
   

3. 다음 예제에서처럼 System.Web.DynamicData 네임스페이스를 참조하도록 asp 태그 접두사를 구성합니다.

   <system.web>
     <pages>
       <controls>
   
         <add tagPrefix="asp" namespace="System.Web.DynamicData"          assembly="System.Web.DynamicData, Version=3.5.0.0,          Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
       </controls>
     </pages>
   </system.web>
   

4. Web.config 파일을 저장한 다음 닫습니다.

데이터 모델 설정

이 단원에서는 웹 사이트의 동적 동작을 구현하는 핵심 구성 요소인 데이터 모델을 만드는 방법을 보여 줍니다. 이 연습에서는 LINQ-to-SQL 데이터 모델을 사용합니다. 그러나 ADO.NET Entity Framework 데이터 모델을 사용할 수도 있습니다. 이 단원에서는 데이터 모델에 메타데이터 정보를 추가하는 방법을 보여 줍니다.

데이터 모델을 만들려면

1. 솔루션 탐색기에서 프로젝트 이름을 마우스 오른쪽 단추로 클릭하고 ASP.NET 폴더 추가를 클릭한 다음 App_Code를 클릭합니다.

2. App_Code 폴더를 마우스 오른쪽 단추로 클릭한 다음 새 항목 추가를 클릭합니다.

3. Visual Studio에 설치되어 있는 템플릿에서 LINQ to SQL 클래스를 클릭합니다.

4. 이름 상자에서 데이터베이스 모델 이름으로 AdventureWorksLT.dbml을 입력합니다.

5. 추가를 클릭합니다.

   O/R 디자이너(개체 관계형 디자이너)가 표시됩니다. 자세한 내용은 O/R 디자이너(개체 관계형 디자이너)를 참조하십시오.

6. O/R 디자이너에서 서버 탐색기 링크를 클릭합니다.

7. 서버 탐색기의 데이터 연결에서 AdventureWorksLT_Data.mdf 노드를 확장한 다음 테이블 노드를 확장합니다.

8. Customer 테이블을 O/R 디자이너 창으로 끌어서 놓습니다.

9. AdventureWorksLT.dbml 파일을 저장한 다음 닫습니다.

   이제 AdventureWorksLT 데이터베이스를 나타내는 데이터 모델이 만들어졌습니다.

다음 절차에서는 사용자 입력에 대한 사용자 지정 유효성 검사를 추가하는 방법을 보여 줍니다. 또한 Calendar 컨트롤을 사용하여 DateTime 데이터 필드를 표시 및 편집하기 위한 UI를 렌더링하는 방법도 보여 줍니다.

사용자 지정 유효성 검사 및 메타데이터를 데이터 모델에 추가하려면

1. 솔루션 탐색기에서 App_Code 폴더를 마우스 오른쪽 단추로 클릭한 다음 새 항목 추가를 클릭합니다.

2. Visual Studio에 설치되어 있는 템플릿에서 클래스를 클릭합니다.

3. 이름 상자에서 사용자 지정 필드 템플릿을 사용하여 표시할 데이터가 포함된 데이터베이스 테이블(데이터 모델에 정의된 데이터베이스 테이블)의 이름을 입력합니다. 이 연습에서는 Customer 클래스를 사용하므로 이름이 Customer.cs 또는 Customer.vb인 클래스 파일을 만듭니다. 나중에 데이터 필드에 특성을 적용하기 위해 만들 연결된 클래스도 이 파일에 포함됩니다.

4. Customer 클래스 정의를 partial 클래스로 만들려면 해당 클래스 정의에 Visual Basic의 Partial 키워드 또는 Visual C#의 partial 키워드를 추가합니다.

5. Visual C#에 클래스를 만드는 경우 기본 생성자를 삭제합니다.

   다음 예제에서는 업데이트된 클래스 선언을 보여 줍니다.

   public partial class Customer {
   
   }
   

   Partial Public Class Customer
   
   End Class
   

6. 다음 예제에서처럼 Visual Basic의 Imports 키워드 또는 Visual C#의 using 키워드를 사용하여 System.Web.DynamicData 및 System.ComponentModel.DataAnnotations 네임스페이스에 대한 참조를 추가합니다.

   using System.Web.DynamicData;
   using System.ComponentModel.DataAnnotations;
   

   Imports System.Web.DynamicData
   Imports System.ComponentModel.DataAnnotations 
   

7. 연결된 메타데이터 클래스로 사용할 또 다른 partial 클래스를 같은 파일에 만듭니다. 이 클래스에는 원하는 이름을 지정할 수 있습니다. 이 연습에서는 다음 예제와 같이 클래스 이름을 CustomerMetadata로 지정합니다.

   public partial class CustomerMetadata
   {
   
   }
   

   Partial Public Class CustomerMetadata
   
   End Class 
   

8. MetadataTypeAttribute 특성을 Customer partial 클래스에 적용합니다. 특성의 매개 변수에 대해서는 이전 단계에서 만든 연결된 메타데이터 클래스의 이름인 CustomerMetadata를 지정합니다.

   다음 예제에서는 이 특성이 적용된 Customer partial 클래스를 보여 줍니다.

   [MetadataType(typeof(CustomerMetadata))]
   public partial class Customer {
   
   }
   

   <MetadataType(GetType(CustomerMetadata))> _
   Partial Public Class Customer
   
   End Class
   

9. 메타데이터 클래스에서 Object 형식의 ModifiedDate라는 public 필드를 만듭니다.

   메타데이터 클래스에서 표시 및 편집 동작을 사용자 지정할 각 데이터 필드에 대해 필드를 하나씩 만듭니다. 메타데이터 클래스의 필드 이름에 대해서는 수정할 데이터 필드의 이름을 그대로 사용합니다.

10. ModifiedDate 필드에 UIHintAttribute 특성을 적용하고 매개 변수에 "DateCalendar"를 지정합니다. 이 값은 나중에 만들 필드 템플릿의 이름입니다.

    참고:
    Object는 메타데이터 형식에서 마커로 사용되어 해당 데이터 필드를 나타냅니다. Dynamic Data는 데이터 모델에서 실제 형식을 유추합니다.

    다음 예제에서는 UIHintAttribute 특성이 적용된 상태를 보여 줍니다.

    public partial class CustomerMetadata
    {
        [UIHint("DateCalendar")]
        public object ModifiedDate;
    }
    

    Partial Public Class CustomerMetadata
        <UIHint("DateCalendar")> _
        Public ModifiedDate As Object
    End Class 
    

11. 메타데이터 클래스에서 FirstName 및 LastName 속성에 대한 public 필드를 만듭니다.

12. FirstName 및 LastName 데이터 필드에 RegularExpressionAttribute 특성을 적용합니다. 영문자, 공백 및 하이픈만 허용하고 이름을 40자로 제한하는 정규식 패턴을 지정합니다. 유효성 검사에 실패할 경우 표시할 사용자 지정 오류 메시지를 포함합니다.

    다음 예제에서는 특성이 적용된 FirstName 및 LastName 필드를 보여 줍니다.

    [RegularExpression(@"^[a-zA-Z''-'\s]{1,40}$",     ErrorMessage="Entered characters are not allowed.")]
    public object FirstName;
    
    [RegularExpression(@"^[a-zA-Z''-'\s]{1,40}$",    ErrorMessage = "Entered characters are not allowed.")]
    public object LastName; 
    

    <RegularExpression("^[a-zA-Z''-'\s]{1,40}$", _    ErrorMessage:="Entered characters are not allowed.")> _
    Public FirstName As Object
    
    <RegularExpression("^[a-zA-Z''-'\s]{1,40}$", _    ErrorMessage:="Entered characters are not allowed.")> _
    Public LastName As Object
    

    데이터 필드가 데이터 모델에 정의된 Customer 테이블 열과 일치한다는 점을 유의해서 보십시오. 이러한 테이블 열은 Dynamic Data가 데이터 필드를 렌더링할 때 사용할 메타데이터 정보를 추가하려는 경우에만 사용합니다.

    이 정규식 패턴에서는 최대 40자의 대문자 및 소문자와 영어 이름에 일반적인 몇 가지 특수 문자를 사용할 수 있습니다.

13. 클래스 파일을 저장하고 닫습니다.

이제 Dynamic Data가 메타데이터 정보에 액세스할 수 있도록 데이터 모델 컨텍스트를 등록할 수 있습니다.

데이터 모델 컨텍스트를 등록하려면

1. 솔루션 탐색기에서 프로젝트 이름을 마우스 오른쪽 단추로 클릭한 다음 새 항목 추가를 클릭합니다.

2. Visual Studio에 설치되어 있는 템플릿에서 전역 응용 프로그램 클래스를 선택하고 추가를 클릭합니다.

   그러면 Global.asax 파일이 사이트에 추가됩니다.

3. 다음 예제와 같이 System.Web.DynamicData 네임스페이스를 참조하는 Namespace 특성과 함께 @ Import 지시문을 추가합니다.

   <%@ Import Namespace="System.Web.DynamicData" %>
   

4. 다음 예제와 같이 Application_Start 메서드에서 스캐폴딩 옵션을 사용하지 않은 상태로 데이터 컨텍스트를 등록합니다.

   이 등록 작업에 따라 Dynamic Data는 사용할 데이터 모델을 확인하게 되며, 테이블에 대해 스캐폴딩 옵션을 사용하지 않게 됩니다. 이 마지막 단계는 필수 단계는 아니지만 웹 사이트에서 스캐폴딩을 사용하지 않는다는 점을 강조하기 위해 제시되었습니다.

   MetaModel model = new MetaModel();
   model.RegisterContext(typeof(AdventureWorksLTDataContext), 
   new ContextConfiguration() {ScaffoldAllTables = false });
   

   Dim model As MetaModel = New MetaModel()
   model.RegisterContext(GetType( _
       AdventureWorksLTDataContext), _
       New ContextConfiguration() With { _
       .ScaffoldAllTables = False})
   

5. Global.asax 파일을 저장한 다음 닫습니다.

필드 템플릿 만들기

필드 템플릿은 Dynamic Data가 데이터 필드를 표시 및 편집하기 위한 UI를 렌더링하는 데 사용하는 사용자 정의 컨트롤입니다. Dynamic Data는 데이터 컨텍스트에 나타나는 각 데이터 필드 형식에 대해 필드 템플릿을 사용합니다. 특정 데이터 필드 형식에 대한 필드 템플릿이 없고 대체 규칙을 사용해서도 필드 템플릿을 찾을 수 없는 경우 Dynamic Data는 예외를 throw합니다.

Dynamic Data 웹 사이트를 만들면 일반적인 데이터베이스 데이터 형식을 나타내는 여러 필드 템플릿이 사이트에 포함됩니다. 이러한 필드 템플릿은 페이지 템플릿, 마스터 페이지 및 CSS 스타일시트 파일와 함께 생성됩니다. 그러나 이 연습에서는 기존 사이트에 Dynamic Data 기능을 추가하는 방법에 대해 설명하므로 기본 필드 템플릿에 대한 액세스 권한이 없다고 가정합니다.

이 연습에서 만드는 필드 템플릿은 Dynamic Data 웹 사이트의 기본 템플릿과 유사합니다. 자세한 내용은 ASP.NET Dynamic Data 필드 템플릿 개요를 참조하십시오. 스캐폴딩을 사용하는 웹 사이트를 만들 때 생성되는 기본 필드 템플릿을 볼 수 있습니다. 자세한 내용은 연습: 스캐폴딩을 사용하여 새 Dynamic Data 웹 사이트 만들기를 참조하십시오.

이 단원에서는 다음 템플릿을 만드는 방법을 보여 줍니다.

• String 형식 데이터 필드를 표시 및 편집하기 위한 UI를 렌더링하는 필드 템플릿

• DateTime 형식 데이터 필드를 표시 및 편집하기 위한 UI를 렌더링하는 필드 템플릿

String 데이터용 필드 템플릿 만들기

이 단원에서는 String 데이터 필드를 표시 및 편집하기 위한 UI를 렌더링할 필드 템플릿을 만드는 방법을 보여 줍니다.

String 데이터 필드를 표시 및 편집할 필드 템플릿을 만들려면

1. 솔루션 탐색기에서 프로젝트 이름을 마우스 오른쪽 단추로 클릭한 다음 새 폴더를 클릭합니다.

2. 새 폴더의 이름을 DynamicData로 바꿉니다.

   참고:
   Dynamic Data에서 이름은 특수한 의미를 가지므로 반드시 이 절차에서 설명하는 폴더 이름을 사용해야 합니다.

3. 솔루션 탐색기에서 DynamicData 폴더를 마우스 오른쪽 단추로 클릭한 다음 새 폴더를 클릭합니다.

4. 새 폴더의 이름을 FieldTemplates로 바꿉니다.

5. 솔루션 탐색기에서 FieldTemplates 폴더를 마우스 오른쪽 단추로 클릭한 다음 새 항목 추가를 클릭합니다.

6. Visual Studio에 설치되어 있는 템플릿에서 Dynamic Data 필드를 클릭합니다.

7. 이름 상자에 Text.ascx를 입력합니다. 이때 다른 파일에 코드 입력을 선택해야 합니다.

8. 추가를 클릭합니다.

   Text.ascx 및 Text_Edit.ascx라는 두 개의 필드 템플릿이 생성됩니다. 첫 번째 컨트롤은 String 데이터 필드를 표시하기 위한 UI를 렌더링하고 두 번째 컨트롤은 String 데이터 필드를 편집하기 위한 UI를 렌더링합니다.

9. Text_Edit.ascx 파일을 열고 @ Control 지시문에서 AutoEventWireup 특성을 true로 설정합니다.

10. 사용자 정의 컨트롤 파일을 저장한 다음 닫습니다.

    이제 String 데이터 필드를 표시 및 편집하기 위한 UI를 렌더링하는 필드 템플릿이 만들어졌습니다.

DateTime 필드 템플릿 만들기

이 단원에서는 DateTime 데이터 필드를 표시 및 편집하기 위한 UI를 렌더링할 필드 템플릿을 만드는 방법을 보여 줍니다. 표시 필드 템플릿은 시간이 생략된 간단한 날짜 표현을 사용합니다. 편집 필드 템플릿은 Calendar 컨트롤을 사용하여 사용자가 새 값을 입력할 수 있도록 합니다.

DateTime 데이터 필드를 표시 및 편집할 필드 템플릿을 만들려면

1. 솔루션 탐색기에서 DynamicData\FieldTemplates 폴더를 마우스 오른쪽 단추로 클릭한 다음 새 항목 추가를 클릭합니다.

2. Visual Studio에 설치되어 있는 템플릿에서 Dynamic Data 필드를 클릭합니다.

3. 이름 상자에 DateCalendar.ascx를 입력합니다. 이때 다른 파일에 코드 입력을 선택해야 합니다.

4. 추가를 클릭합니다.

   DateCalendar.ascx 및 DateCalendar_Edit.ascx라는 두 개의 필드 템플릿이 생성됩니다. 첫 번째 컨트롤은 DateTime 데이터 필드를 표시하기 위한 UI를 렌더링하고 두 번째 컨트롤은 DateTime 데이터 필드를 편집하기 위한 UI를 렌더링합니다.

5. DateCalendar.ascx 파일을 엽니다.

6. 다음 예제와 같이 Literal 컨트롤에서 Text 특성에 할당된 FieldValueString을 삭제합니다.

   <asp:Literal ID="Literal1" />
   

7. 사용자 정의 컨트롤 파일을 저장하고 닫습니다.

8. DateCalendar.ascx.vb 또는 DateCalendar.ascx.cs 필드 템플릿 코드 숨김 파일을 엽니다.

9. 다음 예제와 같이 사용자 정의 컨트롤 OnDataBinding 메서드를 재정의하여 시간을 제외하고 표시하도록 DateTime 값의 형식을 지정합니다. 필드 값은 FieldValue에서 사용할 수 있습니다.

   protected override void OnDataBinding(EventArgs e)
   {
     base.OnDataBinding(e);
     string shortDate = string.Empty;
     if (FieldValue != null)
     {
       DateTime dt = (DateTime)FieldValue;
       shortDate = dt.ToShortDateString();
     }
     Literal1.Text = shortDate;
   }
   

   Protected Overloads Overrides Sub OnDataBinding( _
       ByVal e As EventArgs)
       MyBase.OnDataBinding(e)
       Dim shortDate As String = String.Empty
       If FieldValue IsNot Nothing Then
         Dim dt As DateTime = Format(CType(FieldValue, DateTime), "d")
         shortDate = dt.ToShortDateString()
       End If
       Literal1.Text = shortDate
   End Sub  
   

10. 코드 숨김 파일을 저장한 다음 닫습니다.

11. DateCalendar_Edit.ascx 파일을 엽니다.

12. @ Control 지시문에서 AutoEventWireup 특성을 true로 설정합니다.

13. 다음 예제와 같이 TextBox 컨트롤에서 Text 특성의 FieldValueString 식을 사용자 지정 GetDateString() 메서드로 바꿉니다.

    <asp:TextBox ID="TextBox1"  
      Text='<%# GetDateString() %>' >
    </asp:TextBox>
    

14. 다음 태그를 파일에 추가하여 대체 날짜 편집 방법을 사용하기 위한 UI를 렌더링하는 Calendar 컨트롤을 정의합니다.

    <asp:Calendar ID="Calendar1"  
      VisibleDate=
        '<%# (FieldValue != null) ? FieldValue : DateTime.Now %>'
      SelectedDate=
        '<%# (FieldValue != null) ? FieldValue : DateTime.Now %>'
      OnSelectionChanged="Calendar1_SelectionChanged" />
    

    <asp:Calendar ID="Calendar1"  
      VisibleDate=
      '<%# If(FieldValue,DateTime.Now)%>'
      SelectedDate=
      '<%# If(FieldValue,DateTime.Now) %>'
      OnSelectionChanged="Calendar1_SelectionChanged" /> 
    

15. 필드 템플릿 파일을 저장한 다음 닫습니다.

16. DateCalendar_Edit.ascx.vb 또는 DateCalendar_Edit.ascx.cs 코드 숨김 파일을 엽니다.

17. GetDateString 메서드를 추가합니다. 메서드에서 TextBox 컨트롤을 통해 입력된 사용자 입력을 처리합니다. 이 메서드는 시간이 제외된 간단한 날짜 형식을 사용하여 날짜 형식을 지정합니다.

    다음 예제에서는 이 작업을 수행하는 방법을 보여 줍니다.

    protected string GetDateString()
    {
      if (FieldValue != null)
      {
        DateTime dt = (DateTime)FieldValue;
        return dt.ToShortDateString();
      }
      else
        return string.Empty;
    }
    

    Protected Function GetDateString() As String
      If FieldValue <> Nothing Then
        Dim dt As DateTime = Format(CType(FieldValue, DateTime), "d")
          Return dt.ToShortDateString()
      Else
        Return String.Empty
      End If
    End Function
    

18. Calendar 컨트롤의 SelectionChanged 이벤트에 대한 처리기를 추가합니다.

19. 처리기에서 TextBox 컨트롤의 Text 속성을 달력에서 선택한 날짜의 형식이 지정된 버전으로 설정합니다. 이렇게 하면 사용자의 현재 선택 항목이 텍스트 상자에 표시됩니다.

    다음 예제에서는 처리기를 보여 줍니다.

    protected void Calendar1_SelectionChanged(
      object sender, EventArgs e)
    {
      // Display value using the short date format.
      TextBox1.Text = 
      Calendar1.SelectedDate.ToString("d");
    }
    

    Protected Sub Calendar1_SelectionChanged( _
        ByVal sender As Object, ByVal e As EventArgs)
        ' Display value using the short date format.
        TextBox1.Text = Calendar1.SelectedDate.ToString("d")
    End Sub
    

20. 필드 템플릿 파일을 저장한 다음 닫습니다.

    이제 DateTime 데이터 필드 형식을 표시 및 편집하기 위한 UI를 렌더링하는 필드 템플릿이 만들어졌습니다. 필드 템플릿이 적절한 형식 및 유효성 검사를 적용하도록 Dynamic Data에 지시합니다. 또한 유효성 검사에 실패하면 필드 템플릿은 적절한 오류 메시지를 생성합니다.

Customer 테이블을 표시할 사용자 지정 페이지 만들기

이 단원에서는 동적 동작을 구현하는 GridView 컨트롤을 사용하여 Customer 테이블을 표시하는 사용자 지정 페이지를 만드는 방법을 보여 줍니다.

컨트롤의 동적 동작을 구현하려면 다음을 수행합니다.

• DynamicDataManager 컨트롤에 컨트롤 등록

• 표시할 각 데이터 필드의 Columns 속성에 DynamicField 요소 추가

데이터베이스 테이블에는 String 및 DateTime 데이터 필드 형식이 포함되어 있기 때문에 동적 동작을 구현하는 GridView 컨트롤을 사용하여 테이블 데이터를 표시할 경우 Dynamic Data는 방금 만든 사용자 지정 필드 템플릿을 사용합니다.

Customers 테이블을 표시할 사용자 지정 페이지를 만들려면

1. 솔루션 탐색기에서 프로젝트 이름을 마우스 오른쪽 단추로 클릭한 다음 새 항목 추가를 선택합니다.

2. Visual Studio에 설치되어 있는 템플릿에서 Web Form을 선택합니다.

   이름 상자에 Customers.aspx를 입력합니다. 다른 파일에 코드 입력을 선택해야 합니다.

3. @ Page 지시문에서 AutoEventWireup 특성을 true로 설정합니다.

4. 소스 뷰에서 다음 예제와 같이 DynamicDataManager 컨트롤을 페이지 본문에 추가합니다.

   <body>
   
       <asp:DynamicDataManager ID="DynamicDataManager1"      />
   
   </body>
   

   DynamicDataManager 컨트롤은 페이지의 데이터 컨트롤을 동적 컨트롤로 처리하도록 Dynamic Data에 지시합니다.

5. 도구 상자의 데이터 탭에서 LinqDataSource 컨트롤을 페이지에 추가합니다.

6. LinqDataSource 컨트롤의 EnableUpdate 속성을 true로 설정합니다.

   이렇게 하면 데이터 컨트롤을 업데이트할 수 있습니다.

7. LinqDataSource 컨트롤의 TableName 속성을 사용할 테이블(Customers)로 설정합니다.

8. 다음 예제와 같이 ContextTypeName 속성을 데이터 컨텍스트 클래스(AdventureWorksLTDataContext)로 설정합니다.

   <asp:LinqDataSource ID="LinqDataSource1"  
     TableName="Customers"  ContextTypeName="AdventureWorksLTDataContext"  EnableUpdate="true">
   </asp:LinqDataSource>
   

9. 도구 상자의 데이터 탭에서 GridView 컨트롤을 페이지에 추가합니다.

   이 컨트롤은 데이터 필드를 표시하고 수정하는 데 사용합니다.

10. 다음 예제와 같이 GridView 컨트롤의 DataSourceID 속성을 LinqDataSource 컨트롤의 ID로 설정합니다.

    <form ID="Form1"  >
    
        <asp:GridView ID="GridView1"   
          DataSourceID="LinqDataSource1" >
        </asp:GridView>
    </form>
    

11. 다음 예제와 같이 GridView 컨트롤의 AutoGenerateColumns 속성을 false로 설정하고 AutoGenerateEditButton 속성을 true로 설정합니다.

    <asp:GridView ID="GridView1"   
      AutoGenerateEditButton="true"  AutoGenerateColumns="false" >
    </asp:GridView>
    

    이렇게 하면 편집을 수행할 수 있고 데이터베이스 테이블에 기반을 둔 열 자동 생성이 해제됩니다. 대신 DynamicField 컨트롤을 사용하여 GridView 컨트롤을 채울 수 있습니다.

12. 다음 예제와 같이 GridView 컨트롤의 AllowPaging 및 AllowSorting 속성을 true로 설정합니다.

    <asp:GridView ID="GridView1"   
    
      AllowPaging="true"  AllowSorting="true" >
    </asp:GridView>
    

13. 세 개의 DynamicField 컨트롤을 Columns 속성에 추가하고 해당 DataField() 속성을 각각 "FirstName", "LastName" 및 "ModifiedDate"로 설정합니다.

    DynamicField 컨트롤은 ASP.NET Dynamic Data를 사용하여 데이터 모델에서 데이터를 읽은 후 적절한 필드 템플릿을 사용하여 해당 데이터의 형식을 지정합니다. 데이터를 읽거나 형식을 지정하는 방법에 대한 정보를 DynamicField 컨트롤에 포함할 필요는 없습니다. 이러한 작업은 Dynamic Data를 통해 자동으로 처리됩니다.

    다음 예제에서는 DynamicField 컨트롤을 추가한 경우 GridView 컨트롤의 태그를 보여 줍니다.

    <asp:GridView ID="GridView1"
     >
    
      <Columns>    <asp:DynamicField DataField="FirstName" />    <asp:DynamicField DataField="LastName" />    <asp:DynamicField DataField="ModifiedDate" />  </Columns>
    </asp:GridView>
    

    참고:
    DynamicField 컨트롤은 도구 상자에 없으므로 소스 뷰에서 태그로 추가해야 합니다.

14. Customers.aspx 파일을 저장한 다음 닫습니다.

    이제 Customers 테이블에 액세스하는 데 사용할 사용자 지정 페이지가 만들어졌습니다.

15. Customers.aspx.cs 또는 Customers.aspx.vb 코드 숨김 파일을 엽니다.

16. 다음 예제에서처럼 Visual Basic의 Imports 키워드 또는 Visual C#의 using 키워드를 사용하여 System.Web.DynamicData 네임스페이스에 대한 참조를 추가합니다.

    using System.Web.DynamicData;
    

    Imports System.Web.DynamicData
    

17. 다음 예제와 같이 Page_Init 메서드를 만듭니다.

    protected void Page_Init(object sender, 
    EventArgs e)
    {    }
    

    Protected Sub Page_Init(ByVal sender As Object, _
    ByVal e As EventArgs)
    
    End Sub
    

18. Page_Init 메서드에서 DynamicDataManager에 GridView 컨트롤을 등록하여 동적 동작을 설정합니다.

    다음 예제에서는 이 작업을 수행하는 방법을 보여 줍니다.

    protected void Page_Init(object sender, 
    EventArgs e)
    {
        DynamicDataManager1.RegisterControl(GridView1);
    }
    

    Protected Sub Page_Init(ByVal sender As Object, _
        ByVal e As EventArgs)
        DynamicDataManager1.RegisterControl(GridView1)
    End Sub
    

19. 코드 숨김 파일을 닫습니다.

Dynamic Data 테스트

이 단원에서는 Dynamic Data 기능이 웹 사이트에 통합되었는지 확인하는 방법을 보여 줍니다. 데이터 모델을 통해 데이터베이스와 상호 작용할 수 있으며 통합된 기능이 작동하는지 확인할 수 있습니다. 데이터를 수정할 때 잘못된 값을 입력하면 Dynamic Data가 데이터베이스에서 유추한 정보를 기준으로 생성한 오류 메시지를 볼 수 있습니다.

Dynamic Data 기능이 통합되었는지 테스트하려면

1. 솔루션 탐색기에서 Customers.aspx 페이지를 마우스 오른쪽 단추로 클릭하고 브라우저에서 보기를 선택합니다.

   선택한 열이 있는 Customers 테이블을 보여 주는 페이지가 브라우저에 표시됩니다.

2. 임의의 행에서 편집을 클릭하고 이름을 지웁니다.

3. 같은 행에서 업데이트를 클릭합니다.

   Dynamic Data가 FirstName 데이터 필드에는 빈 문자열이 허용되지 않음을 알리는 오류 메시지를 표시합니다.

4. 같은 행에서 취소를 클릭합니다.

5. 임의의 행에서 편집을 클릭한 다음 성을 변경합니다.

6. 같은 행에서 업데이트를 클릭합니다.

   Dynamic Data가 데이터베이스를 업데이트합니다. 성에 올바른 값을 입력했기 때문에 해당 데이터는 앞에서 만든 필드 템플릿의 일부인 유효성 검사 컨트롤을 통과합니다.

7. 임의의 행에서 편집을 클릭하고 이름이나 성으로 영문자가 아닌 문자를 입력합니다.

8. 같은 행에서 업데이트를 클릭합니다.

   Dynamic Data가 앞에서 정규식을 사용하여 지정한 사용자 지정 오류 메시지를 표시합니다. 이 오류 메시지는 허용되지 않는 문자를 입력했음을 알려 줍니다.

9. 같은 행에서 취소를 클릭합니다.

10. 임의의 행에서 편집을 클릭하고 날짜를 지웁니다.

11. 같은 행에서 업데이트를 클릭합니다.

    Dynamic Data가 ModifiedDate 데이터 필드에는 빈 문자열이 허용되지 않음을 알리는 오류 메시지를 표시합니다.

12. 같은 행에서 취소를 클릭합니다.

13. 임의의 행에서 편집을 클릭한 다음 Calendar 컨트롤을 사용하여 날짜를 변경합니다.

14. 같은 행에서 업데이트를 클릭합니다.

    Dynamic Data가 데이터베이스를 업데이트합니다. 날짜에 대해 허용되는 값을 입력했기 때문에 해당 데이터는 앞에서 만든 필드 템플릿의 일부인 유효성 검사 컨트롤을 통과합니다.

다음 단계

이 연습에서는 ASP.NET Dynamic Data의 기본 원리 및 기존 ASP.NET 웹 사이트에 Dynamic Data 기능을 추가하는 방법에 대해 살펴봤습니다. 기존 ASP.NET 웹 사이트에 Dynamic Data 기능을 추가하면 다음을 수행할 수 있습니다.

• 내부 데이터베이스와 상호 작용합니다. Dynamic Data는 CRUD(만들기, 읽기, 업데이트 및 삭제) 작업 등 데이터 기반 응용 프로그램의 핵심 기능을 제공합니다.

• 데이터 필드를 표시 및 편집합니다. 이는 Dynamic Data가 데이터베이스에서 유추한 정보를 기준으로 적절한 필드 템플릿을 선택하기 때문에 가능합니다.

다른 기능을 테스트해 볼 수도 있습니다. 다음과 같은 제안을 따르는 것이 좋습니다.

• 최소한의 코드만 작성하거나 코드를 전혀 작성하지 않고 ASP.NET Dynamic Data를 사용하는 기본 웹 응용 프로그램을 만드는 방법을 배웁니다. 자세한 내용은 연습: 스캐폴딩을 사용하여 새 Dynamic Data 웹 사이트 만들기를 참조하십시오.

• 데이터 컨트롤에 동적 동작을 추가하는 방법을 배웁니다. 자세한 내용은 ASP.NET 데이터 바인딩된 컨트롤에 동적 동작 추가를 참조하십시오.

• 데이터 모델의 데이터 필드 모양 및 동작을 사용자 지정하는 방법을 배웁니다. 자세한 내용은 방법: 데이터 모델의 데이터 필드 모양 및 동작 사용자 지정을 참조하십시오.

• 데이터 모델의 데이터 필드에 대한 유효성 검사를 사용자 지정하는 방법을 배웁니다. 자세한 내용은 방법: 데이터 모델의 데이터 필드 유효성 검사 사용자 지정을 참조하십시오.

일반적인 정보를 알아보려면 다음을 수행할 수 있습니다.

• 웹 응용 프로그램에서 O/R 디자이너를 사용하여 SQL Server 데이터베이스를 나타내는 데이터 클래스를 만드는 방법을 배웁니다. 자세한 내용은 방법: 웹 응용 프로그램에서 LINQ to SQL 클래스 만들기를 참조하십시오.

• LINQ-to-SQL 개체 관계형 매핑에 대해 배웁니다. 자세한 내용은 LINQ to SQL을 참조하십시오.

• O/R 디자이너(개체 관계형 디자이너)에 대해 배웁니다. 자세한 내용은 O/R 디자이너(개체 관계형 디자이너)를 참조하십시오.

참고 항목

개념

ASP.NET Dynamic Data 모델 개요

ASP.NET Dynamic Data 필드 템플릿 개요

ASP.NET Dynamic Data 스캐폴딩 및 페이지 템플릿 개요

ASP.NET Dynamic Data 개요

변경 기록

날짜	변경 내용	이유
2008년 7월	항목이 추가되었습니다.	SP1 기능 변경