데이터베이스 데이터의 테이블 표시(VB)
이 자습서에서는 데이터베이스 레코드 집합을 표시하는 두 가지 방법을 보여 줍니다. HTML 테이블에서 데이터베이스 레코드 집합의 서식을 지정하는 두 가지 방법을 보여 줍니다. 먼저 보기 내에서 직접 데이터베이스 레코드의 서식을 지정하는 방법을 보여 줬습니다. 다음으로 데이터베이스 레코드의 서식을 지정할 때 부분 부분을 활용하는 방법을 보여 줍니다.
이 자습서의 목표는 ASP.NET MVC 애플리케이션에서 데이터베이스 데이터의 HTML 테이블을 표시하는 방법을 설명하는 것입니다. 먼저 Visual Studio에 포함된 스캐폴딩 도구를 사용하여 레코드 집합을 자동으로 표시하는 뷰를 생성하는 방법을 알아봅니다. 다음으로 데이터베이스 레코드의 서식을 지정할 때 부분 을 템플릿으로 사용하는 방법을 알아봅니다.
모델 클래스 만들기
Movies 데이터베이스 테이블의 레코드 집합을 표시하려고 합니다. Movies 데이터베이스 테이블에는 다음 열이 포함되어 있습니다.
| 열 이름 | 데이터 형식 | Null 허용 |
|---|---|---|
| Id | Int | 거짓 |
| 제목 | Nvarchar(200) | 거짓 |
| 감독 | NVarchar(50) | 거짓 |
| DateReleased | DateTime | 거짓 |
ASP.NET MVC 애플리케이션에서 Movies 테이블을 나타내려면 모델 클래스를 만들어야 합니다. 이 자습서에서는 Microsoft Entity Framework를 사용하여 모델 클래스를 만듭니다.
참고
이 자습서에서는 Microsoft Entity Framework를 사용합니다. 그러나 다양한 기술을 사용하여 LINQ to SQL, NHibernate 또는 ADO.NET 포함하여 ASP.NET MVC 애플리케이션의 데이터베이스와 상호 작용할 수 있다는 것을 이해하는 것이 중요합니다.
다음 단계에 따라 엔터티 데이터 모델 마법사를 시작합니다.
- 솔루션 탐색기 창에서 Models 폴더를 마우스 오른쪽 단추로 클릭하고 메뉴 옵션 추가, 새 항목을 선택합니다.
- 데이터 범주를 선택하고 ADO.NET 엔터티 데이터 모델 템플릿을 선택합니다.
- 데이터 모델에 MoviesDBModel.edmx 라는 이름을 지정하고 추가 단추를 클릭합니다.
추가 단추를 클릭하면 엔터티 데이터 모델 마법사가 나타납니다(그림 1 참조). 다음 단계에 따라 마법사를 완료합니다.
- 모델 콘텐츠 선택 단계에서 데이터베이스에서 생성 옵션을 선택합니다.
- 데이터 연결 선택 단계에서 연결 설정에 MoviesDB.mdf 데이터 연결 및 MoviesDBEntities라는 이름을 사용합니다. 다음 단추를 클릭합니다.
- 데이터베이스 개체 선택 단계에서 테이블 노드를 확장하고 Movies 테이블을 선택합니다. 네임스페이스 모델을 입력하고 마침 단추를 클릭합니다.
그림 01: LINQ to SQL 클래스 만들기(전체 크기 이미지를 보려면 클릭)
엔터티 데이터 모델 마법사를 완료하면 엔터티 데이터 모델 Designer 열립니다. Designer Movies 엔터티를 표시해야 합니다(그림 2 참조).
그림 02: 엔터티 데이터 모델 Designer(전체 크기 이미지를 보려면 클릭)
계속하기 전에 한 가지 변경을 수행해야 합니다. 엔터티 데이터 마법사는 Movies 데이터베이스 테이블을 나타내는 Movies 라는 모델 클래스를 생성합니다. Movies 클래스를 사용하여 특정 영화를 나타내기 때문에 클래스의 이름을 영화 대신 무비(복수가 아닌 단수)로 수정해야 합니다.
디자이너 화면에서 클래스의 이름을 두 번 클릭하고 클래스의 이름을 Movies에서 Movie로 변경합니다. 이렇게 변경한 후 저장 단추(플로피 디스크의 아이콘)를 클릭하여 Movie 클래스를 생성합니다.
영화 컨트롤러 만들기
데이터베이스 레코드를 나타내는 방법이 있으므로 영화 컬렉션을 반환하는 컨트롤러를 만들 수 있습니다. Visual Studio 솔루션 탐색기 창에서 컨트롤러 폴더를 마우스 오른쪽 단추로 클릭하고 추가, 컨트롤러 메뉴 옵션을 선택합니다(그림 3 참조).
그림 03: 컨트롤러 추가 메뉴(전체 크기 이미지를 보려면 클릭)
컨트롤러 추가 대화 상자가 나타나면 컨트롤러 이름 MovieController를 입력합니다(그림 4 참조). 추가 단추를 클릭하여 새 컨트롤러를 추가합니다.
그림 04: 컨트롤러 추가 대화 상자(전체 크기 이미지를 보려면 클릭)
데이터베이스 레코드 집합을 반환하도록 Movie 컨트롤러에서 노출하는 Index() 작업을 수정해야 합니다. 목록 1의 컨트롤러처럼 보이도록 컨트롤러를 수정합니다.
목록 1 – Controllers\MovieController.vb
Public Class MovieController
Inherits System.Web.Mvc.Controller
'
' GET: /Movie/
Function Index() As ActionResult
Dim entities As New MoviesDBEntities()
Return View(entities.MovieSet.ToList())
End Function
End Class
목록 1에서 MoviesDBEntities 클래스는 MoviesDB 데이터베이스를 나타내는 데 사용됩니다. 식 엔터티입니다. MovieSet.ToList() 는 Movies 데이터베이스 테이블의 모든 영화 집합을 반환합니다.
보기 만들기
HTML 테이블에 데이터베이스 레코드 집합을 표시하는 가장 쉬운 방법은 Visual Studio에서 제공하는 스캐폴딩을 활용하는 것입니다.
빌드, 솔루션 빌드 메뉴 옵션을 선택하여 애플리케이션 을 빌드합니다. 보기 추가 대화 상자를 열기 전에 애플리케이션을 빌드해야 합니다. 그렇지 않으면 데이터 클래스가 대화 상자에 표시되지 않습니다.
Index() 작업을 마우스 오른쪽 단추로 클릭하고 보기 추가 메뉴 옵션을 선택합니다(그림 5 참조).
그림 05: 보기 추가(전체 크기 이미지를 보려면 클릭)
보기 추가 대화 상자에서 강력한 형식의 보기 만들기라는 확인란을 검사. 보기 데이터 클래스로 Movie 클래스를 선택합니다. 보기 콘텐츠로 목록을 선택합니다(그림 6 참조). 이러한 옵션을 선택하면 영화 목록을 표시하는 강력한 형식의 보기가 생성됩니다.
그림 06: 보기 추가 대화 상자(전체 크기 이미지를 보려면 클릭)
추가 단추를 클릭하면 목록 2의 보기가 자동으로 생성됩니다. 이 보기에는 영화 컬렉션을 반복하고 영화의 각 속성을 표시하는 데 필요한 코드가 포함되어 있습니다.
목록 2 – Views\Movie\Index.aspx
<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage(Of IEnumerable (Of MvcApplication1.Movie))" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
Index
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<h2>Index</h2>
<p>
<%=Html.ActionLink("Create New", "Create")%>
</p>
<table>
<tr>
<th></th>
<th>
Id
</th>
<th>
Title
</th>
<th>
Director
</th>
<th>
DateReleased
</th>
</tr>
<% For Each item In Model%>
<tr>
<td>
<%=Html.ActionLink("Edit", "Edit", New With {.id = item.Id})%> |
<%=Html.ActionLink("Details", "Details", New With {.id = item.Id})%>
</td>
<td>
<%= Html.Encode(item.Id) %>
</td>
<td>
<%= Html.Encode(item.Title) %>
</td>
<td>
<%= Html.Encode(item.Director) %>
</td>
<td>
<%= Html.Encode(String.Format("{0:g}", item.DateReleased)) %>
</td>
</tr>
<% Next%>
</table>
</asp:Content>
메뉴 옵션 디버그, 디버깅 시작 (또는 F5 키 누르기)을 선택하여 애플리케이션을 실행할 수 있습니다. 애플리케이션을 실행하면 인터넷 Explorer 시작됩니다. /Movie URL로 이동하면 그림 7에 페이지가 표시됩니다.
그림 07: 영화 테이블(전체 크기 이미지를 보려면 클릭)
그림 7의 데이터베이스 레코드 표 모양에 대해 마음에 들지 않는 경우 인덱스 보기를 수정하기만 하면 됩니다. 예를 들어 인덱스 보기를 수정하여 DateReleased 헤더를 릴리스 날짜 로 변경할 수 있습니다.
Partial을 사용하여 템플릿 만들기
보기가 너무 복잡해지면 보기를 부분 보기로 분리하는 것이 좋습니다. 부분 을 사용하면 보기를 더 쉽게 이해하고 유지 관리할 수 있습니다. 각 영화 데이터베이스 레코드의 서식을 지정하는 템플릿으로 사용할 수 있는 부분을 만듭니다.
다음 단계에 따라 일부를 만듭니다.
- Views\Movie 폴더를 마우스 오른쪽 단추로 클릭하고 보기 추가 메뉴 옵션을 선택합니다.
- 부분 보기 만들기(.ascx)라는 확인란을 선택합니다.
- 부분 MovieTemplate의 이름을 지정합니다.
- 강력한 형식의 보기 만들기 확인란을 선택합니다.
- 보기 데이터 클래스로 동영상을 선택합니다.
- 보기 콘텐츠로 비어 있음을 선택합니다.
- 추가 단추를 클릭하여 프로젝트에 일부를 추가합니다.
이러한 단계를 완료한 후 MovieTemplate 부분 을 목록 3과 같이 수정합니다.
목록 3 – Views\Movie\MovieTemplate.ascx
<%@ Control Language="VB" Inherits="System.Web.Mvc.ViewUserControl(Of MvcApplication1.Movie)" %>
<tr>
<td>
<%= Html.Encode(Model.Id) %>
</td>
<td>
<%= Html.Encode(Model.Title) %>
</td>
<td>
<%= Html.Encode(Model.Director) %>
</td>
<td>
<%= Html.Encode(String.Format("{0:g}", Model.DateReleased)) %>
</td>
</tr>
목록 3의 부분에는 단일 레코드 행에 대한 템플릿이 포함되어 있습니다.
목록 4의 수정된 인덱스 보기는 MovieTemplate 부분을 사용합니다.
목록 4 – Views\Movie\Index.aspx
<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage(Of IEnumerable (Of MvcApplication1.Movie))" %>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<h2>Index</h2>
<table>
<tr>
<th>
Id
</th>
<th>
Title
</th>
<th>
Director
</th>
<th>
DateReleased
</th>
</tr>
<% For Each item In Model%>
<% Html.RenderPartial("MovieTemplate", item)%>
<% Next%>
</table>
</asp:Content>
목록 4의 보기에는 모든 영화를 반복하는 For Each 루프가 포함되어 있습니다. 각 영화에 대해 MovieTemplate 부분 은 동영상의 서식을 지정하는 데 사용됩니다. MovieTemplate은 RenderPartial() 도우미 메서드를 호출하여 렌더링됩니다.
수정된 인덱스 뷰는 데이터베이스 레코드의 동일한 HTML 테이블을 렌더링합니다. 그러나 보기가 크게 간소화되었습니다.
RenderPartial() 메서드는 문자열을 반환하지 않으므로 대부분의 다른 도우미 메서드와 다릅니다. 따라서 %= Html.RenderPartial() %대신 <% Html.RenderPartial() %를> 사용하여 <RenderPartial()> 메서드를 호출해야 합니다.
요약
이 자습서의 목표는 HTML 테이블에 데이터베이스 레코드 집합을 표시하는 방법을 설명하는 것이었습니다. 먼저 Microsoft Entity Framework를 활용하여 컨트롤러 작업에서 데이터베이스 레코드 집합을 반환하는 방법을 알아보았습니다. 다음으로 Visual Studio 스캐폴딩을 사용하여 항목 컬렉션을 자동으로 표시하는 뷰를 생성하는 방법을 알아보았습니다. 마지막으로, 일부를 활용하여 보기를 단순화하는 방법을 알아보았습니다. 각 데이터베이스 레코드의 서식을 지정할 수 있도록 부분 을 템플릿으로 사용하는 방법을 알아보았습니다.