자습서: ASP.NET MVC 앱을 사용 하 여 EF Database First에 대 한 보기 사용자 지정Tutorial: Customize view for EF Database First with ASP.NET MVC app

MVC, Entity Framework 및 ASP.NET 스 캐 폴딩을 사용 하 여 기존 데이터베이스에 대 한 인터페이스를 제공 하는 웹 응용 프로그램을 만들 수 있습니다.Using MVC, Entity Framework, and ASP.NET Scaffolding, you can create a web application that provides an interface to an existing database. 이 자습서 시리즈에서는 사용자가 데이터베이스 테이블에 있는 데이터를 표시, 편집, 만들기 및 삭제할 수 있도록 하는 코드를 자동으로 생성 하는 방법을 보여 줍니다.This tutorial series shows you how to automatically generate code that enables users to display, edit, create, and delete data that resides in a database table. 생성 된 코드는 데이터베이스 테이블의 열에 해당 합니다.The generated code corresponds to the columns in the database table.

이 자습서에서는 자동으로 생성 된 보기를 변경 하 여 프레젠테이션을 개선 하는 방법을 집중적으로 설명 합니다.This tutorial focuses on changing the automatically-generated views to enhance the presentation.

이 자습서에서는 다음을 수행합니다.In this tutorial, you:

  • 학생 세부 정보 페이지에 과정 추가Add courses to the student detail page
  • 코스가 페이지에 추가 되었는지 확인Confirm that the courses are added to the page

사전 요구 사항Prerequisites

학생 세부 정보에 강좌 추가Add courses to student detail

생성 된 코드는 응용 프로그램에 적합 한 시작 지점을 제공 하지만 응용 프로그램에서 필요한 모든 기능을 제공 하는 것은 아닙니다.The generated code provides a good starting point for your application but it does not necessarily provide all of the functionality that you need in your application. 응용 프로그램의 특정 요구 사항에 맞게 코드를 사용자 지정할 수 있습니다.You can customize the code to meet the particular requirements of your application. 현재 응용 프로그램에는 선택한 학생에 대해 등록 된 강좌가 표시 되지 않습니다.Currently, your application does not display the enrolled courses for the selected student. 이 섹션에서는 각 학생에 대해 등록 된 과정을 학생에 대 한 세부 정보 보기에 추가 합니다.In this section, you will add the enrolled courses for each student to the Details view for the student.

학습자 > > 보기 를 엽니다. cshtml.Open Views > Students > Details.cshtml. 마지막 </dl> 태그 아래에 있지만 closing </div> 태그 앞에 다음 코드를 추가 합니다.Below the last </dl> tag, but before the closing </div> tag, add the following code.

<table class="table">
    <tr>
        <th>
            Course Title
        </th>
        <th>
            Grade
        </th>
        <th>
            Credits
        </th>
    </tr>

    @foreach (var item in Model.Enrollments)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.Course.Title)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Grade)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Course.Credits)
            </td>
        </tr>
    }
</table>

이 코드는 선택한 학생에 대해 등록 테이블의 각 레코드에 대 한 행을 표시 하는 테이블을 만듭니다.This code creates a table that displays a row for each record in the Enrollment table for the selected student. 표시 메서드는 식을 나타내는 개체 (modelitem)의 HTML을 렌더링 합니다.The Display method renders HTML for the object (modelItem) that represents the expression. 표시 메서드 (코드에 속성 값을 포함 하는 것이 아님)를 사용 하 여 해당 형식 및 해당 형식의 템플릿에 따라 값의 형식이 올바르게 지정 되었는지 확인 합니다.You use the Display method (rather than simply embedding the property value in the code) to make sure the value is formatted correctly based on its type and the template for that type. 이 예에서는 각 식이 루프의 현재 레코드에서 단일 속성을 반환 하 고, 값은 텍스트로 렌더링 되는 기본 형식입니다.In this example, each expression returns a single property from the current record in the loop, and the values are primitive types which are rendered as text.

강좌 추가 확인Confirm courses are added

솔루션을 실행합니다.Run the solution. 학생 목록 을 클릭 하 고 학생 중 한 명에 대 한 세부 정보 를 선택 합니다.Click List of students and select Details for one of the students. 등록 된 강좌가 보기에 포함 되어 있는 것을 볼 수 있습니다.You will see the enrolled courses have been included in the view.

등록 된 학생

다음 단계Next steps

이 자습서에서는 다음을 수행합니다.In this tutorial, you:

  • 학생 세부 정보 페이지에 강좌를 추가 했습니다.Added courses to the student detail page
  • 코스가 페이지에 추가 되었는지 확인Confirmed that the courses are added to the page

다음 자습서로 이동 하 여 유효성 검사 요구 사항을 지정 하 고 서식을 표시 하는 데이터 주석을 추가 하는 방법을 알아봅니다.Advance to the next tutorial to learn how to add data annotations to specify validation requirements and display formatting.