연습: GridView 웹 서버 컨트롤에 대한 간단한 정렬
업데이트: 2007년 11월
ASP.NET GridView 컨트롤의 기본 제공 정렬 기능을 사용하면 코딩하지 않고도 데이터에 단일 열 정렬을 추가할 수 있습니다.
이 연습을 통해 다음 작업을 수행하는 방법을 배웁니다.
- GridView 컨트롤의 기본 제공 정렬 기능을 사용합니다.
사전 요구 사항
이 연습을 완료하려면 다음과 같은 요건을 갖추어야 합니다.
Microsoft Visual Web Developer(Visual Studio)
SQL Server Northwind 데이터베이스에 대한 액세스 권한 SQL Server 샘플 Northwind 데이터베이스를 다운로드 및 설치하는 방법에 대한 자세한 내용은 Microsoft SQL Server 웹 사이트의 예제 데이터베이스 설치를 참조하십시오.
.gif "참고")
참고:SQL Server가 실행되는 컴퓨터에 로그온하는 방법에 대한 자세한 내용은 서버 관리자에게 문의하십시오.
Northwind 데이터베이스에 액세스할 수 있는 SQL Server 계정의 사용자 이름과 암호
MDAC(Microsoft Data Access Components) 버전 2.7 이상
Microsoft Windows XP나 Windows Server 2003을 사용하고 있는 경우 MDAC 2.7이 이미 설치되어 있습니다. 그러나 Microsoft Windows 2000을 사용하는 경우 컴퓨터에 이미 설치된 MDAC를 업그레이드해야 할 수도 있습니다. 자세한 내용은 MSDN Library에서 "Microsoft Data Access Components (MDAC) Installation"을 참조하십시오.
웹 사이트 및 페이지 만들기
다음 단계에 따라 새 웹 사이트를 만듭니다.
파일 시스템 웹 사이트를 만들려면
Visual Web Developer를 엽니다.
파일 메뉴에서 새로 만들기를 클릭한 다음 웹 사이트를 클릭합니다. Visual Web Developer Express를 사용하는 경우 파일 메뉴에서 새웹 사이트를 클릭합니다.
새 웹 사이트 대화 상자가 나타납니다.
Visual Studio에 설치되어 있는 템플릿에서 ASP.NET 웹 사이트를 선택합니다.
위치 상자에서 파일 시스템을 선택하고 웹 사이트의 페이지를 보관할 폴더의 이름을 입력합니다.
예를 들어, C:\WebSites\SimpleSort라는 폴더 이름을 입력합니다.
언어 목록에서 Visual Basic 또는 **Visual C#**을 클릭합니다.
확인을 클릭합니다.
Visual Web Developer에서는 폴더와 Default.aspx라는 새 페이지를 만듭니다.
GridView 컨트롤에 데이터 표시
이 단원에서는 GridView 컨트롤을 페이지에 추가하고 Northwind 데이터베이스 Customers 표의 데이터를 표시하도록 이 컨트롤을 구성합니다.
GridView 컨트롤에 데이터를 표시하려면
Default.aspx 파일로 전환하거나 이 파일을 엽니다.
디자인 뷰로 전환합니다.
도구 상자의 데이터 그룹에서 GridView 컨트롤을 페이지로 끌어 옵니다.
GridView 작업 메뉴의 데이터 소스선택 드롭다운 목록에서 **<새 데이터 소스>**를 클릭합니다.
데이터 소스 구성 마법사가 나타납니다.
데이터베이스를 클릭합니다.
이는 SQL Server나 그 밖의 OLE-DB 호환 데이터베이스와 같이 SQL 문을 지원하는 데이터베이스에서 데이터를 가져오려 한다는 의미입니다.
데이터 소스의 ID 지정 상자에 기본 데이터 소스 컨트롤 이름인 SqlDataSource1이 표시됩니다. 이 이름을 그대로 둘 수 있습니다.
확인을 클릭합니다.
데이터 소스 구성 마법사가 표시됩니다.
새 연결을 클릭합니다.
연결 추가 대화 상자가 나타납니다.
데이터 소스 목록에 **Microsoft SQL Server (SqlClient)**가 표시되지 않으면 변경을 클릭하고 데이터 소스 변경 대화 상자에서 Microsoft SQL Server를 선택합니다.
데이터 소스 선택 페이지가 나타나면 데이터 소스 목록에서 사용할 데이터 소스의 형식을 선택합니다. 이 연습에서 데이터 소스 형식은 Microsoft SQL Server입니다. 데이터 공급자 목록에서 .NET Framework Data Provider for SQL Server를 클릭한 다음 계속을 클릭합니다.
서버 이름 상자에 SQL Server 컴퓨터의 이름을 입력합니다.
서버에 로그온 섹션에서 SQL Server 구성에 적합한 옵션(Windows 인증 또는 특정 ID와 암호)을 선택합니다.
필요한 경우 사용자 이름과 암호를 입력합니다.
데이터베이스 이름 선택 또는 입력 상자에서 Northwind를 선택합니다.
연결 테스트 단추를 클릭하여 연결을 테스트합니다. 연결이 성공했음을 확인한 경우 확인을 클릭합니다.
연결 정보가 채워져 있는 데이터 소스 구성 - SqlDataSource1 마법사로 돌아갑니다.
다음을 클릭합니다.
마법사는 구성 파일에 연결 문자열을 저장할 수 있는 페이지를 표시합니다. 구성 파일에 연결 문자열을 저장할 경우 두 가지 장점이 있습니다.
페이지에 저장하는 것보다 안전합니다.
여러 페이지에서 동일한 연결 문자열을 다시 사용할 수 있습니다.
예, 이 연결을 다음으로 저장합니다. 확인란이 선택되었는지 확인하고 다음을 클릭합니다. 기본 연결 문자열 이름을 그대로 둘 수 있습니다.
마법사는 데이터베이스에서 검색하려는 데이터를 지정할 수 있는 페이지를 표시합니다.
테이블 또는 뷰의 열 지정에 있는 이름 드롭다운 목록에서 Customers를 선택합니다.
열 아래에서 CustomerID, CompanyName 및 City 확인란을선택합니다.
마법사는 만들고 있는 SQL 문을 페이지 아래쪽의 상자에 표시합니다.
참고:마법사에서는 선택 기준(WHERE 절) 및 기타 SQL 쿼리 옵션을 지정할 수 있습니다. 이 연습에서는 선택이나 정렬 옵션 없이 간단한 문을 만듭니다.
다음을 클릭합니다.
쿼리 테스트를 클릭하여 원하는 데이터가 검색되는지 확인합니다.
마침을 클릭합니다.
마법사는 SqlDataSource 컨트롤을 만들어 페이지에 추가합니다. 앞서 추가한 GridView 컨트롤이 SqlDataSource 컨트롤에 바인딩됩니다. SqlDataSource 컨트롤의 속성을 확인하면, 마법사에서 ConnectionString 및 SelectQuery 속성의 값을 생성했음을 알 수 있습니다.
마우스 오른쪽 단추로 GridView 컨트롤을 클릭하고 스마트 태그 표시를 클릭한 다음 GridView 작업 메뉴에서 정렬 사용을 클릭합니다.
GridView 컨트롤의 열 머리글이 링크로 바뀝니다.
이제 페이지를 테스트할 수 있습니다.
페이지를 테스트하려면
Ctrl+F5를 눌러 페이지를 실행합니다.
GridView 컨트롤에 CustomerID, CompanyName 및 City 열이 표시됩니다.
열 머리글을 클릭하면 열의 내용을 기준으로 정렬됩니다.
열을 다시 클릭하면 오름차순과 내림차순 정렬 간에 전환됩니다.
다음 단계
GridView 컨트롤의 여러 열 정렬도 사용해 봅니다. 자세한 내용은 GridView 웹 서버 컨트롤의 데이터 정렬을 참조하십시오.