방법: Dynamic Data 컨트롤의 데이터 필드 모양 및 동작 사용자 지정

아티클
10/22/2014

업데이트: 2007년 11월

ASP.NET Dynamic Data는 필드 템플릿을 사용하여 테이블의 각 데이터 필드를 렌더링합니다. 필드 템플릿은 일반적으로 데이터베이스의 데이터 형식에 따라 결정되는 CLR(공용 언어 런타임) 데이터 형식에 매핑되는 사용자 정의 컨트롤(.ascx 파일)입니다. ASP.NET Dynamic Data는 일반적으로 각 데이터 형식을 표시하는 데 사용할 사용자 정의 컨트롤 하나와 해당 형식의 데이터를 수정 또는 삽입하는 데 사용할 사용자 정의 컨트롤 하나를 제공합니다.

이 항목에서는 DynamicControl 컨트롤 및 DynamicField 필드 같은 Dynamic Data 컨트롤에서 UIHint 속성을 설정하여 데이터 필드의 모양과 동작을 사용자 지정하는 방법을 설명합니다. UIHint 속성은 이러한 개체 중 하나에 의해 특정 데이터 필드가 렌더링될 때 사용할 필드 템플릿을 지정합니다. UIHint 속성은 제공된 템플릿이나 사용자가 직접 만든 템플릿 중 하나를 가리킬 수 있습니다. 이 방법은 Dynamic Data가 자동으로 생성하는 페이지를 사용하는 대신 사용자 지정 웹 페이지를 만들어 데이터를 표시하고 편집하는 경우에 유용합니다.

또는 특성을 사용하여 응용 프로그램 전체에서 데이터 필드의 표시와 모양을 변경할 수도 있습니다. 자세한 내용은 방법: 데이터 모델의 데이터 필드 모양 및 동작 사용자 지정을 참조하십시오.

데이터 바인딩된 컨트롤의 데이터 필드 모양 및 동작을 사용자 지정하려면

원하는 경우 데이터 모델의 특정 데이터 필드에 대한 UI를 정의하는 사용자 지정 필드 템플릿을 만듭니다. 자세한 내용은 방법: 데이터 모델의 데이터 필드 표시 사용자 지정을 참조하십시오.

GridView 또는 DetailsView 컨트롤을 사용할 경우 DynamicField 개체를 추가하고 해당 UIHint 속성을 데이터 표시에 사용할 필드 템플릿의 이름으로 설정합니다.

다음 예제에서는 필드에 DynamicField 컨트롤을 사용하여 RedText라는 필드 템플릿을 통해 ProductName 열을 렌더링하는 방법을 보여 줍니다. 디스플레이 모드에서는 RedText.ascx라는 필드 템플릿을 사용하여 데이터를 표시하고 편집 또는 삽입 모드에서는 RedText_Edit.ascx라는 필드 템플릿을 사용하여 데이터를 표시합니다.

<asp:DynamicField
  UIHint="RedText"
  DataField="ProductName" />

참고:
지정한 필드 템플릿을 찾지 못하면 Dynamic Data는 대체 메커니즘을 사용합니다. 자세한 내용은 ASP.NET Dynamic Data 필드 템플릿 개요를 참조하십시오.

템플릿 또는 템플릿 필드를 사용하는 데이터 바인딩된 컨트롤, 예를 들어 ListView 또는 FormView 컨트롤을 사용할 경우 DynamicControl 컨트롤을 추가하여 데이터를 표시하고 해당 UIHint 속성을 표시할 데이터 필드의 이름으로 설정합니다.

다음 예제에서는 항목이 편집 모드에 있을 경우 RedText라는 필드 템플릿을 사용하여 ProductName 열을 렌더링하도록 지정합니다. 런타임에 Dynamic Data는 RedText_Edit.ascx라는 사용자 정의 컨트롤을 찾습니다.
```
<EditItemTemplate>
  <asp:DynamicControl 
    Mode="Edit"
    UIHint="RedText"
    DataField="ProductName" />
</EditItemTemplate>
```

예제

다음 예제에서는 GridView 컨트롤의 DynamicField 필드에 UIHint 속성을 추가하는 방법을 보여 줍니다. 이 속성은 Calendar 컨트롤을 표시하는 사용자 지정 필드 템플릿을 데이터 필드에 사용하여 연속되지 않는 날짜를 편집할 수 있도록 설정됩니다. 두 번째 및 세 번째 예제에서는 날짜를 간단한 형식으로 표시하고 필드를 편집할 수 있도록 UI를 정의하는 필드 템플릿의 사용자 정의 컨트롤 코드를 보여 줍니다.

<%@ Page Language="VB" %>

<script >

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

</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" >
    <title>UIHint Property Sample</title>
    <link href="~/Site.css" rel="stylesheet" type="text/css" />
</head>
<body>

  <form id="form1" >
    <div>
      <h2><%= ProductsDataSource.TableName%> table</h2>

      <asp:DynamicDataManager ID="DynamicDataManager1" 
        AutoLoadForeignKeys="true" />

      <asp:ScriptManager ID="ScriptManager1"  EnablePartialRendering="true"/>

      <asp:UpdatePanel ID="UpdatePanel1" >
        <ContentTemplate>        

          <asp:GridView ID="ProductsGridView"  DataSourceID="ProductsDataSource"
            AutoGenerateEditButton="true"
            AutoGenerateColumns="false"
            AllowSorting="true"
            AllowPaging="true">
            <Columns>
              <asp:DynamicField DataField="Name" />
              <asp:DynamicField DataField="ProductNumber" />
              <asp:DynamicField DataField="DiscontinuedDate" UIHint="DateCalendar" />
            </Columns>        
            <EmptyDataTemplate>
              There are currently no items in this table.
            </EmptyDataTemplate>
          </asp:GridView>

          <!-- This example uses Microsoft SQL Server and connects   -->
          <!-- to the AdventureWorksLT sample database.              -->
          <asp:LinqDataSource ID="ProductsDataSource"  
            EnableUpdate="true"
            TableName="Products" 
            ContextTypeName="AdventureWorksLTDataContext" />

          </ContentTemplate>
        </asp:UpdatePanel>

    </div>
  </form>
</body>
</html>

<%@ Page Language="C#" %>

<script >

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

</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" >
    <title>UIHint Property Sample</title>
    <link href="~/Site.css" rel="stylesheet" type="text/css" />
</head>
<body>

  <form id="form1" >
    <div>
      <h2><%= ProductsDataSource.TableName%> table</h2>

      <asp:DynamicDataManager ID="DynamicDataManager1" 
        AutoLoadForeignKeys="true" />

      <asp:ScriptManager ID="ScriptManager1"  EnablePartialRendering="true"/>

      <asp:UpdatePanel ID="UpdatePanel1" >
        <ContentTemplate>        

          <asp:GridView ID="ProductsGridView"  DataSourceID="ProductsDataSource"
            AutoGenerateEditButton="true"
            AutoGenerateColumns="false"
            AllowSorting="true"
            AllowPaging="true">
            <Columns>
              <asp:DynamicField DataField="Name" />
              <asp:DynamicField DataField="ProductNumber" />
              <asp:DynamicField DataField="DiscontinuedDate" UIHint="DateCalendar" />
            </Columns>        
            <EmptyDataTemplate>
              There are currently no items in this table.
            </EmptyDataTemplate>
          </asp:GridView>

          <asp:LinqDataSource ID="ProductsDataSource"  
            EnableUpdate="true"
            TableName="Products" 
            ContextTypeName="AdventureWorksLTDataContext" />

          </ContentTemplate>
        </asp:UpdatePanel>

    </div>
  </form>
</body>
</html>

<%@ Control Language="VB" Inherits="System.Web.DynamicData.FieldTemplateUserControl" %>

<script >

  Function GetDateString() As String 
    If Not (FieldValue Is Nothing) Then
      Dim dt As DateTime = CType(FieldValue, DateTime)
      Return dt.ToShortDateString()
    Else
      Return String.Empty
    End If
  End Function
</script>

<%# GetDateString() %>

<%@ Control Language="C#" Inherits="System.Web.DynamicData.FieldTemplateUserControl" %>

<script >
    string GetDateString() 
    {
      if (FieldValue != null)
      {
        DateTime dt = (DateTime)FieldValue;
        return dt.ToShortDateString();
      }
      else
      {
        return string.Empty;
      }
    }
</script>

<%# GetDateString() %>

<%@ Control Language="VB" Inherits="System.Web.DynamicData.FieldTemplateUserControl" %>

<script >

  Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
    TextBox1.ToolTip = Column.Description

    SetUpValidator(RequiredFieldValidator1)
    SetUpValidator(RegularExpressionValidator1)
    SetUpValidator(DynamicValidator1)
  End Sub

  Protected Overrides Sub ExtractValues(ByVal dictionary As IOrderedDictionary)
    dictionary(Column.Name) = ConvertEditedValue(TextBox1.Text)
  End Sub

  Public Overrides ReadOnly Property DataControl() As Control
    Get
      Return TextBox1
    End Get
  End Property

  Protected Sub Calendar1_SelectionChanged(ByVal sender As Object, ByVal e As System.EventArgs)
    TextBox1.Text = Calendar1.SelectedDate.ToString("d")
  End Sub

  Function GetDateString() As String
    If Not (FieldValue Is Nothing) Then
      Dim dt As DateTime = CType(FieldValue, DateTime)
      Return dt.ToShortDateString()
    Else
      Return String.Empty
    End If
  End Function

</script>

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

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

<asp:RequiredFieldValidator  ID="RequiredFieldValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />
<asp:RegularExpressionValidator  ID="RegularExpressionValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />  
<asp:DynamicValidator  ID="DynamicValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" />

<%@ Control Language="C#" Inherits="System.Web.DynamicData.FieldTemplateUserControl" %>

<script >
    protected void Page_Load(object sender, EventArgs e) {
        TextBox1.ToolTip = Column.Description;

        SetUpValidator(RequiredFieldValidator1);
        SetUpValidator(RegularExpressionValidator1);
        SetUpValidator(DynamicValidator1);
    }

    protected override void ExtractValues(IOrderedDictionary dictionary) {
      dictionary[Column.Name] = ConvertEditedValue(TextBox1.Text);
    }

    public override Control DataControl
    {
      get
      {
        return TextBox1;
      }
    }  

    protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
      TextBox1.Text = Calendar1.SelectedDate.ToString("d");
    }

    string GetDateString()
    {
      if (FieldValue != null)
      {
        DateTime dt = (DateTime)FieldValue;
        return dt.ToShortDateString();
      }
      else
      {
        return string.Empty;
      }
    }
</script>

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

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

<asp:RequiredFieldValidator  ID="RequiredFieldValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />
<asp:RegularExpressionValidator  ID="RegularExpressionValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" Enabled="false" />  
<asp:DynamicValidator  ID="DynamicValidator1" 
  CssClass="droplist" ControlToValidate="TextBox1" Display="Dynamic" />

코드 컴파일

이 예제를 컴파일하려면 다음 요소가 필요합니다.

Dynamic Data 웹 사이트 또는 Dynamic Data 웹 응용 프로그램
AdventureWorks 샘플 데이터베이스 또는 AdventureWorksLT 샘플 데이터베이스. SQL Server 샘플을 다운로드 및 설치하는 방법에 대한 자세한 내용은 CodePlex 사이트의 Microsoft SQL Server Product Samples: Database를 참조하십시오. 실행 중인 SQL Server 버전(SQL Server 2005 또는 SQL Server 2008)에 맞는 올바른 샘플 데이터베이스 버전을 설치해야 합니다.
AdventureWorks 또는 AdventureWorksLT 데이터베이스의 Products 테이블에 액세스하도록 구성된 LINQ to SQL 클래스
Global.asax 파일에서 Dynamic Data에 사용하도록 등록된 데이터 컨텍스트 개체

강력한 프로그래밍

다음 조건에서 예외가 발생할 수 있습니다.

데이터베이스를 사용할 수 없는 경우

참고 항목

다음을 통해 공유

방법: Dynamic Data 컨트롤의 데이터 필드 모양 및 동작 사용자 지정

데이터 바인딩된 컨트롤의 데이터 필드 모양 및 동작을 사용자 지정하려면

예제

코드 컴파일

강력한 프로그래밍

참고 항목

작업

개념

참조

추가 리소스