DataList 웹 서버 컨트롤 개요

아티클
10/22/2014

업데이트: 2007년 11월

DataList 웹 서버 컨트롤은 데이터베이스 정보 행을 사용자 지정 가능한 형식으로 표시합니다. 데이터를 표시하는 형식은 사용자가 만드는 템플릿에서 정의됩니다. 항목, 교대로 반복되는 항목, 선택한 항목 및 편집 항목에 사용할 템플릿을 만들 수 있습니다. 또한 머리글, 바닥글 및 구분 기호 템플릿을 사용하여 DataList의 전체 모양을 사용자 지정할 수 있습니다. 템플릿에 Button 웹 서버 컨트롤을 포함시켜 사용자가 디스플레이 모드, 선택 모드, 편집 모드 사이를 전환할 수 있게 하는 코드를 목록 항목에 연결할 수 있습니다.

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

배경
코드 예제
클래스 참조

배경

DataList 웹 서버 컨트롤에서는 템플릿과 스타일을 사용하여 정의할 수 있는 형식으로 데이터를 표시합니다. DataList 컨트롤은 테이블처럼 반복적인 구조의 데이터에 유용합니다. DataList 컨트롤은 열이나 행에서 순서를 지정하는 경우처럼 서로 다른 레이아웃으로 행을 표시할 수 있습니다.

참고:
DataList 컨트롤은 HTML 테이블 요소를 사용하여 목록의 항목을 렌더링합니다. 목록을 렌더링하는 데 사용되는 HTML을 세부적으로 제어하려면 DataList 컨트롤 대신 Repeater 웹 서버 컨트롤을 사용하십시오.

사용자가 정보를 편집하거나 삭제할 수 있도록 DataList 컨트롤을 구성할 수도 있으며 이 컨트롤을 사용자 지정하여 행 선택 같은 다른 기능을 지원할 수도 있습니다.

템플릿에 HTML 텍스트와 컨트롤을 삽입하여 데이터 항목의 레이아웃을 정의합니다. 예를 들어, 데이터 소스의 필드를 표시할 항목에 Label 웹 서버 컨트롤을 사용할 수 있습니다.

다음 단원에서는 DataList 컨트롤의 기능을 소개합니다.

컨트롤에 데이터 바인딩

DataList 웹 서버 컨트롤을 데이터 소스에 바인딩해야 합니다. 가장 일반적인 데이터 소스는 SqlDataSource 또는 ObjectDataSource 컨트롤 같은 데이터 소스 컨트롤입니다. 또한 IEnumerable 인터페이스를 구현하는 클래스에 DataList 컨트롤을 바인딩할 수도 있습니다. 이 클래스에는 ADO.NET 데이터 집합(DataSet 클래스), 데이터 판독기(SqlDataReader 또는 OleDbDataReader 클래스)나 대부분의 컬렉션이 포함됩니다. 데이터를 바인딩할 때는 DataList 컨트롤 전체에 대한 데이터 소스를 지정합니다. 목록 항목의 레이블이나 텍스트 상자 같은 컨트롤을 이 컨트롤에 추가할 때는 현재 데이터 항목의 필드에 자식 컨트롤의 속성을 바인딩할 수 있습니다.

DataList 항목의 템플릿 정의

DataList 컨트롤에서 정보의 레이아웃을 정의하려면 템플릿을 사용합니다.

참고:
템플릿 사용에 대한 개요를 보려면 ASP.NET 웹 서버 컨트롤 템플릿을 참조하십시오.

다음 표에서는 DataList 컨트롤에서 지원하는 템플릿을 설명합니다.

템플릿 속성	설명
ItemTemplate	데이터 소스의 각 행에 대해 한 번 렌더링하는 HTML 요소 및 컨트롤을 포함합니다.
AlternatingItemTemplate	데이터 소스에서 두 행에 한 번씩 렌더링하는 HTML 요소 및 컨트롤을 포함합니다. 일반적으로 ItemTemplate 속성에서 지정한 색이 아닌 다른 배경색을 지정하는 경우처럼 한 행씩 건너서 다른 모양을 만들려는 경우 이 템플릿을 사용합니다.
SelectedItemTemplate	사용자가 DataList 컨트롤에서 항목을 선택할 때 렌더링할 요소를 포함합니다. 일반적으로 다른 배경색이나 글꼴 색을 사용하여 선택한 행을 시각적으로 구분할 때 이 템플릿을 사용합니다. 항목을 확장하여 데이터 소스의 추가 필드를 표시할 수도 있습니다.
EditItemTemplate	편집 모드일 때 항목의 레이아웃을 지정합니다. 이 템플릿에는 보통 TextBox 컨트롤 같은 편집 컨트롤이 포함되어 있습니다.
HeaderTemplate 및 FooterTemplate	목록의 처음과 끝에서 각각 렌더링하는 텍스트와 컨트롤을 포함합니다.
SeparatorTemplate	각 항목 사이에서 렌더링하는 요소를 포함합니다. HR 요소를 사용하는 선을 예로 들 수 있습니다.

스타일

템플릿에서 항목의 모양을 지정하려면 템플릿의 스타일을 설정합니다. 예를 들어, 다음과 같이 지정할 수 있습니다.

항목을 흰색 배경에 검정 텍스트로 렌더링합니다.
교대로 반복되는 항목을 연한 회색 배경에 검정 텍스트로 렌더링합니다.
선택된 항목을 노랑 배경에 굵은 검정 텍스트로 렌더링합니다.
편집 중인 항목을 연한 파랑 배경에 검정 텍스트로 렌더링합니다.

각 템플릿에서는 디자인 타임과 런타임에 속성을 설정할 수 있는 고유의 스타일 개체를 지원합니다. 다음과 같은 스타일을 사용할 수 있습니다.

자세한 내용은 ASP.NET 웹 서버 컨트롤 및 CSS 스타일을 참조하십시오.

항목 레이아웃

DataList 컨트롤은 HTML 테이블을 사용하여 템플릿이 적용되는 항목의 렌더링을 레이아웃합니다. DataList 항목을 렌더링하는 데 사용되는 각 테이블 셀의 순서, 방향 및 열 수를 제어할 수 있습니다. 다음 표에서는 DataList 컨트롤에서 지원하는 레이아웃 옵션을 설명합니다.

레이아웃 옵션	설명
선형 레이아웃	선형 레이아웃에서는 목록 항목이 워드프로세서 문서에서처럼 일렬로 렌더링됩니다.
테이블 레이아웃	테이블 레이아웃에서는 항목이 HTML 테이블로 렌더링됩니다. 이렇게 하면 모눈선 같은 테이블 셀 속성을 설정할 수 있으므로 항목의 모양을 지정하는 데 보다 다양한 옵션을 사용할 수 있습니다. 자세한 내용은 방법: DataList 웹 서버 컨트롤에서 선형 또는 테이블 모드 지정을 참조하십시오.
세로 및 가로 레이아웃	기본적으로 DataList 컨트롤의 항목은 단일 세로 열에 표시되지만 컨트롤에 둘 이상의 열이 포함되도록 지정할 수 있습니다. 이런 경우 항목을 신문의 칼럼처럼 세로로 정렬하거나 달력의 날짜처럼 가로로 정렬하도록 지정할 수 있습니다. 자세한 내용은 방법: DataList 웹 서버 컨트롤에서 가로 또는 세로 레이아웃 지정을 참조하십시오.
열 수	DataList 컨트롤의 항목이 세로 또는 가로로 정렬되는지에 관계없이 목록에 포함되는 열 수를 지정할 수 있습니다. 이렇게 하면 가로로 스크롤할 필요가 없도록 렌더링된 웹 페이지의 너비를 제어할 수 있습니다.

이벤트

DataList 컨트롤은 여러 가지 이벤트를 지원합니다. 이러한 이벤트 중 ItemCreated 이벤트를 사용하면 런타임에 항목 생성 프로세스를 사용자 지정할 수 있습니다. ItemDataBound 이벤트도 DataList 컨트롤을 사용자 지정하는 기능을 제공하지만 이 기능은 데이터를 검사할 수 있게 된 후에만 사용할 수 있습니다. 예를 들어, DataList 컨트롤을 사용하여 작업 목록을 표시하는 경우 완료되지 않은 항목은 빨강 텍스트로, 완료된 항목은 검정 텍스트로, 기타 작업은 녹색 텍스트로 표시할 수 있습니다. 두 이벤트 모두 템플릿 정의에 있는 서식을 재정의하는 데 사용할 수 있습니다.

나머지 이벤트는 목록 항목에서 단추를 클릭할 때 그에 대한 응답으로 발생하며, DataList 컨트롤에서 가장 일반적으로 사용되는 기능에 응답하도록 되어 있습니다. 이런 형식의 이벤트로 다음 네 가지가 지원됩니다.

이러한 이벤트가 발생하도록 하려면 Button, LinkButton 또는 ImageButton 컨트롤을 DataList 컨트롤의 템플릿에 추가하고 단추의 CommandName 속성을 edit, delete, update 또는 cancel 등의 키워드로 설정하십시오. 사용자가 항목에서 단추를 클릭하면 이벤트가 단추의 컨테이너인 DataList 컨트롤로 전달됩니다. 단추에서 발생하는 이벤트는 클릭한 단추의 CommandName 속성 값에 따라 다릅니다. 예를 들어, 단추의 CommandName 속성을 edit로 설정하면 단추를 클릭할 때 EditCommand 이벤트가 발생합니다. CommandName 속성을 delete로 설정하면 DeleteCommand 이벤트가 발생합니다.

DataList 컨트롤은 사용자가 edit나 delete 등의 미리 정의된 명령이 없는 단추를 클릭할 때 발생하는 ItemCommand 이벤트도 지원합니다. 단추의 CommandName 속성을 원하는 값으로 설정한 다음 ItemCommand 이벤트 처리기에서 테스트하는 방식으로 사용자 지정 기능에 이 이벤트를 사용할 수 있습니다. 예를 들어 방법: DataList 웹 서버 컨트롤에서 항목 선택 허용에 설명된 대로 항목을 선택할 때 이 방법을 사용할 수 있습니다.

Web Forms 이벤트에 대한 자세한 내용은 ASP.NET 웹 서버 컨트롤 이벤트 모델을 참조하십시오.

항목 편집 및 선택

사용자가 컨트롤의 개별 항목을 편집하도록 할 수 있습니다. GridView, DetailsView 및 FormView 컨트롤 등의 다른 데이터 컨트롤은 데이터 소스 컨트롤과 상호 작용하여 자동 업데이트 및 페이징을 지원합니다. 반대로 DataList 컨트롤은 데이터 소스 컨트롤의 업데이트 기능, 자동 페이징 또는 정렬 기능을 자동으로 사용할 수 없습니다. DataList 컨트롤을 사용하여 업데이트, 페이징 및 정렬을 수행하려면 직접 작성한 코드로 업데이트 작업을 수행해야 합니다.

일반적으로 이를 위해서는 편집에 적합한 레이아웃과 컨트롤을 제공하는 EditItemTemplate을 만듭니다. 사용자가 항목을 편집하려는 의사를 표시할 수 있는 방법도 제공해야 합니다. 일반적으로 이 작업은 항목 템플릿에 단추를 삽입하고 단추의 CommandName 속성을 edit로 설정하면 됩니다. AlternatingItemTemplate 속성을 사용 중인 경우에는 여기에도 단추를 삽입합니다. 그러면 단추를 클릭할 때 DataList 컨트롤에서 자동으로 EditCommand 이벤트가 발생합니다. 이벤트 처리기에 대해 작성한 코드에서 항목을 편집 모드로 설정하여 EditItemTemplate이 표시되도록 합니다.

EditItemTemplate에는 일반적으로 사용자가 변경 내용을 저장하거나 취소하는 데 사용할 수 있는 업데이트 및 취소 등의 단추가 있습니다. 이러한 단추는 편집 단추와 비슷하게 작동하여 update 또는 cancel 등의 미리 정의된 명령 메시지를 DataList 컨트롤로 보냅니다. 그러면 적절하게 대응할 수 있는 UpdateCommand 또는 CancelCommand 이벤트가 발생합니다. 자세한 내용은 방법: DataList 웹 서버 컨트롤에서 항목 편집 허용을 참조하십시오.

항목을 선택하는 방법은 위와 유사하지만 SelectedIndexChanged 이벤트를 사용합니다. ItemTemplate에 단추를 추가하고 단추의 CommandName 속성을 select로 설정합니다. 그런 다음 SelectedIndexChanged 이벤트에 대한 이벤트 처리기를 작성합니다. 사용자가 선택 단추를 클릭하면 SelectedIndexChanged 이벤트가 발생합니다. 자세한 내용은 방법: DataList 웹 서버 컨트롤에서 항목 선택 허용을 참조하십시오. 자세한 내용은 방법: DataList 웹 서버 컨트롤에서 항목 선택 허용을 참조하십시오.

맨 위로 이동