Tutorial: Menyesuaikan tampilan untuk EF Database First dengan aplikasi MVC ASP.NET

Dengan menggunakan MVC, Entity Framework, dan ASP.NET Scaffolding, Anda dapat membuat aplikasi web yang menyediakan antarmuka ke database yang sudah ada. Seri tutorial ini menunjukkan kepada Anda cara membuat kode secara otomatis yang memungkinkan pengguna menampilkan, mengedit, membuat, dan menghapus data yang berada dalam tabel database. Kode yang dihasilkan sesuai dengan kolom dalam tabel database.

Tutorial ini berfokus pada perubahan tampilan yang dihasilkan secara otomatis untuk meningkatkan presentasi.

Di tutorial ini, Anda akan:

• Menambahkan kursus ke halaman detail siswa
• Konfirmasikan bahwa kursus ditambahkan ke halaman

Prasyarat

• Mengubah database

Menambahkan kursus ke detail siswa

Kode yang dihasilkan menyediakan titik awal yang baik untuk aplikasi Anda tetapi tidak selalu menyediakan semua fungsionalitas yang Anda butuhkan dalam aplikasi Anda. Anda dapat menyesuaikan kode untuk memenuhi persyaratan tertentu dari aplikasi Anda. Saat ini, aplikasi Anda tidak menampilkan kursus terdaftar untuk siswa yang dipilih. Di bagian ini, Anda akan menambahkan kursus terdaftar untuk setiap siswa ke tampilan Detail untuk siswa.

Buka Views>Students>Details.cshtml. Di bawah tag /dl> terakhir<, tetapi sebelum tag penutup </div>, tambahkan kode berikut.

<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>

Kode ini membuat tabel yang menampilkan baris untuk setiap rekaman dalam tabel Pendaftaran untuk siswa yang dipilih. Metode Tampilan merender HTML untuk objek (modelItem) yang mewakili ekspresi. Anda menggunakan metode Tampilan (bukan hanya menyematkan nilai properti dalam kode) untuk memastikan nilai diformat dengan benar berdasarkan jenisnya dan templat untuk jenis tersebut. Dalam contoh ini, setiap ekspresi mengembalikan satu properti dari rekaman saat ini dalam perulangan, dan nilainya adalah jenis primitif yang dirender sebagai teks.

Konfirmasi kursus ditambahkan

Jalankan solusi tersebut. Klik Daftar siswa dan pilih Detail untuk salah satu siswa. Anda akan melihat kursus terdaftar telah disertakan dalam tampilan.

Langkah berikutnya

Di tutorial ini, Anda akan:

• Menambahkan kursus ke halaman detail siswa
• Mengonfirmasi bahwa kursus ditambahkan ke halaman

Lanjutkan ke tutorial berikutnya untuk mempelajari cara menambahkan anotasi data untuk menentukan persyaratan validasi dan pemformatan tampilan.

Meningkatkan validasi data