방법: Web Forms 페이지에 Repeater 웹 서버 컨트롤 추가

아티클
10/22/2014

업데이트: 2007년 11월

Repeater 웹 서버 컨트롤은 개별 항목의 목록을 만드는 데이터 바인딩된 컨테이너 컨트롤입니다. 템플릿을 사용하여 웹 페이지에서 개별 항목의 레이아웃을 정의합니다. 페이지가 실행되면 이 컨트롤은 데이터 소스에서 각 항목에 대한 레이아웃을 반복합니다. Repeater 웹 서버 컨트롤을 Web Forms 페이지에 추가하려면 여러 단계를 완료해야 합니다. 다음 절차에서는 Repeater 컨트롤을 만드는 데 필요한 최소한의 단계를 설명합니다.

Web Forms 페이지에 Repeater 웹 서버 컨트롤을 추가하려면

디자인 뷰로 전환한 후 도구 상자의 데이터 탭에서 SqlDataSource 컨트롤 또는 ObjectDataSource 컨트롤 같은 데이터 소스 컨트롤을 페이지로 끌어 옵니다.
데이터 소스 구성 마법사를 사용하여 데이터 소스 컨트롤에 대한 연결과 쿼리 또는 데이터 검색 메서드를 정의합니다. 데이터 소스 구성 마법사는 사이트 맵만 있으면 컨트롤을 채울 수 있는 SiteMapDataSource 컨트롤을 제외한 모든 데이터 소스에서 사용할 수 있습니다. 데이터 소스 구성 마법사를 열려면 다음 단계를 수행합니다.
1. 데이터 소스 컨트롤을 마우스 오른쪽 단추로 클릭한 다음 스마트 태그 표시를 클릭합니다.
2. 데이터 소스 작업 창에서 데이터 소스 구성을 클릭합니다.
도구 상자의 데이터 탭에서 Repeater 컨트롤을 페이지로 끌어 옵니다.
Repeater 컨트롤을 마우스 오른쪽 단추로 클릭한 다음 스마트 태그 표시를 클릭합니다.
데이터 소스 선택 목록에서 1단계와 2단계를 통해 만든 데이터 소스 컨트롤의 이름을 클릭합니다.

이렇게 하면 컨트롤의 DataSourceID 속성이 설정됩니다. 쿼리에 기본 키가 포함된 경우에는 컨트롤의 DataKeyField 속성도 설정됩니다.
소스를 클릭하여 소스 뷰로 전환합니다.

템플릿을 정의하려면 소스 뷰에 있어야 합니다.

<ItemTemplate> 요소를 Repeater 컨트롤의 자식으로 페이지에 추가합니다. 구문은 Repeater 웹 서버 컨트롤 선언 구문을 참조하십시오.

참고:
런타임에 렌더링하려면 Repeater 컨트롤은 field name이 데이터베이스의 필드 이름인 <%# Eval("field name") %> 폼에 속하는 데이터 바인딩 식을 차례대로 포함하는 ItemTemplate을 포함해야 합니다. 템플릿을 사용하는 방법에 대한 자세한 내용은 ASP.NET 웹 서버 컨트롤 템플릿을 참조하십시오.

HTML 및 다른 웹 서버 컨트롤이나 HTML 서버 컨트롤을 ItemTemplate에 추가합니다.

필요에 따라 AlternatingItemTemplate, SeparatorTemplate, HeaderTemplate, FooterTemplate 템플릿을 정의합니다.

다음 코드 예제에서는 Repeater 컨트롤을 사용하여 HTML 표에 데이터를 표시하는 방법을 보여 줍니다. table 요소는 HeaderTemplate으로 시작하고 FooterTemplate으로 끝납니다. Repeater 컨트롤의 본문 내에서 표 셀은 데이터 소스에서 가져온 열을 표시하는 데 사용됩니다. AlternatingItemTemplate 요소는 표 셀의 배경색이 다르다는 점을 제외하면 ItemTemplate 항목과 같습니다.

<%@ Page Language="VB" %>

<!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>ASP.NET Repeater Example</title>
</head>
<body>
  <form id="form1" >
    <div>
      <asp:Repeater ID="Repeater1"  DataSourceID="SqlDataSource1">
        <HeaderTemplate>
          <table>
            <tr>
              <th>
                Name</th>
              <th>
                Description</th>
            </tr>
        </HeaderTemplate>
        <ItemTemplate>
          <tr>
            <td style="background-color:#CCFFCC">
              <asp:Label  ID="Label1" Text='<%# Eval("CategoryName") %>' />
            </td>
            <td style="background-color:#CCFFCC">
              <asp:Label  ID="Label2" Text='<%# Eval("Description") %>' />
            </td>
          </tr>
        </ItemTemplate>
        <AlternatingItemTemplate>
          <tr>
            <td>
              <asp:Label  ID="Label3" Text='<%# Eval("CategoryName") %>' />
            </td>
            <td>
              <asp:Label  ID="Label4" Text='<%# Eval("Description") %>' />
            </td>
          </tr>
        </AlternatingItemTemplate>
        <FooterTemplate>
          </table>
        </FooterTemplate>
      </asp:Repeater>
      <asp:SqlDataSource ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        ID="SqlDataSource1"  SelectCommand="SELECT [CategoryID], [CategoryName], 
            [Description] FROM [Categories]"></asp:SqlDataSource>
    </div>
  </form>
</body>
</html>

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

<!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>ASP.NET Repeater Example</title>
</head>
<body>
  <form id="form1" >
    <div>
      <asp:Repeater ID="Repeater1"  DataSourceID="SqlDataSource1">
        <HeaderTemplate>
          <table>
            <tr>
              <th>
                Name</th>
              <th>
                Description</th>
            </tr>
        </HeaderTemplate>
        <ItemTemplate>
          <tr>
            <td style="background-color:#CCFFCC">
              <asp:Label  ID="Label1" Text='<%# Eval("CategoryName") %>' />
            </td>
            <td style="background-color:#CCFFCC">
              <asp:Label  ID="Label2" Text='<%# Eval("Description") %>' />
            </td>
          </tr>
        </ItemTemplate>
        <AlternatingItemTemplate>
          <tr>
            <td>
              <asp:Label  ID="Label3" Text='<%# Eval("CategoryName") %>' />
            </td>
            <td>
              <asp:Label  ID="Label4" Text='<%# Eval("Description") %>' />
            </td>
          </tr>
        </AlternatingItemTemplate>
        <FooterTemplate>
          </table>
        </FooterTemplate>
      </asp:Repeater>
      <asp:SqlDataSource ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        ID="SqlDataSource1"  SelectCommand="SELECT [CategoryID], [CategoryName], 
              [Description] FROM [Categories]"></asp:SqlDataSource>
    </div>
  </form>
</body>
</html>

참고 항목

참조

Repeater 웹 서버 컨트롤 개요

다음을 통해 공유

방법: Web Forms 페이지에 Repeater 웹 서버 컨트롤 추가

Web Forms 페이지에 Repeater 웹 서버 컨트롤을 추가하려면

참고 항목

참조

추가 리소스