01.04.02. Razor Pages: Details

Bu bölümde bir kaydın içeriği görüntüleyen kodu göreceğiz. Özellikle get işlemine ve EF Core ile veriye nasıl ulaşıldığına dikkat ediniz.

Mevcut bir kaydın verisini görüntülemek için hangi kayıt olduğunu bilmeminiz gerekir. Bunu da ancak PK: birincil anahtar üzerinden bulabiliriz. Index sayfasında Detail kısmında oluşan linkte bir PK bilgisi mevcut idi. Örneğin, “Movies/Edit?id=1” şeklinde bir HTML çıktısı üretiliyordu. Öncelikle buradaki id verisini almamız gerekir. details.cshtml.cs ile başlayalım.

details.cshtml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.EntityFrameworkCore;
using RazorPagesMovie.Models;

namespace RazorPagesMovie.Pages.Movies
{
    public class DetailsModel : PageModel
    {
        private readonly RazorPagesMovie.Models.RazorPagesMovieContext _context;

        public DetailsModel(RazorPagesMovie.Models.RazorPagesMovieContext context)
        {
            _context = context;
        }

        public Movie Movie { get; set; }

        public async Task<IActionResult> OnGetAsync(int? id)
        {
            if (id == null)
            {
                return NotFound();
            }

            Movie = await _context.Movie.FirstOrDefaultAsync(m => m.ID == id);

            if (Movie == null)
            {
                return NotFound();
            }
            return Page();
        }
    }
}

using System;

using System.Collections.Generic;

using System.Linq;

using System.Threading.Tasks;

using Microsoft.AspNetCore.Mvc;

using Microsoft.AspNetCore.Mvc.RazorPages;

using Microsoft.EntityFrameworkCore;

using RazorPagesMovie.Models;

namespace RazorPagesMovie.Pages.Movies

{

public class DetailsModel : PageModel

{

private readonly RazorPagesMovie.Models.RazorPagesMovieContext _context;

public DetailsModel(RazorPagesMovie.Models.RazorPagesMovieContext context)

{

_context = context;

}

public Movie Movie { get; set; }

public async Task<IActionResult> OnGetAsync(int? id)

{

if (id == null)

{

return NotFound();

}

Movie = await _context.Movie.FirstOrDefaultAsync(m => m.ID == id);

if (Movie == null)

{

return NotFound();

}

return Page();

}

context’in bir modele bağlanmak için kullandığını açıklamıştık. Bu bölümde de ilgili modelle ilişki kurarak başlıyoruz. Burada tek sonuç döneceği için public Movie Movie { get; set; } şeklinde bir değişken yeterli olacaktır. Şimdi bu değişkenin içindeki Movie nesnesine değerleri aktarma işlemine gelelim. Asenkron olan OnGetAsync metodu int? id şeklinde bir tanımla ile linkten gelen id verisini alır. Burada bir Task<IActionResult> döndürülür. Eğer id değeri hiç gönderilmez veya Movie değeri null ise NotFound değeri aksi takdirde Page değeri döndürülür. Page değeri details.cshtml dosyasını işaret eder.

Movie nesnesinin verileri elde etmesi için _context.Movie.FirstOrDefaultAsync metodu kullanılır. Bu metoda m => m.ID == id şeklindeki bir lambda ifadesi ile gelen id değeri gönderilir. FirstOrDefaultAsync döndürülen ilk değeri veya geçerli değeri döndürür. SQL olarak düşünecek olursak SELECT ve WHERE kalıplarının kullandığını bir ifade yazmamız gerekecekti. Ancak EF Core sayesinde biz fark etmeden arka planda bu işlem yapıldı. Şimdi görsel kısmımıza Razor kodlarımıza gelelim.

details.cshtml

@page
@model RazorPagesMovie.Pages.Movies.DetailsModel

@{
    ViewData["Title"] = "Details";
}

<h1>Details</h1>

<div>
    <h4>Movie</h4>
    <hr />
    <dl class="row">
        <dt class="col-sm-2">
            @Html.DisplayNameFor(model => model.Movie.Title)
        </dt>
        <dd class="col-sm-10">
            @Html.DisplayFor(model => model.Movie.Title)
        </dd>
        <dt class="col-sm-2">
            @Html.DisplayNameFor(model => model.Movie.ReleaseDate)
        </dt>
        <dd class="col-sm-10">
            @Html.DisplayFor(model => model.Movie.ReleaseDate)
        </dd>
        <dt class="col-sm-2">
            @Html.DisplayNameFor(model => model.Movie.Genre)
        </dt>
        <dd class="col-sm-10">
            @Html.DisplayFor(model => model.Movie.Genre)
        </dd>
        <dt class="col-sm-2">
            @Html.DisplayNameFor(model => model.Movie.Price)
        </dt>
        <dd class="col-sm-10">
            @Html.DisplayFor(model => model.Movie.Price)
        </dd>
    </dl>
</div>
<div>
    <a asp-page="./Edit" asp-route-id="@Model.Movie.ID">Edit</a> |
    <a asp-page="./Index">Back to List</a>
</div>

@page

@model RazorPagesMovie.Pages.Movies.DetailsModel

ViewData["Title"] = "Details";

}

<h1>Details</h1>

<div>

<h4>Movie</h4>

<hr />

@Html.DisplayNameFor(model => model.Movie.Title)

</dt>

@Html.DisplayFor(model => model.Movie.Title)

</dd>

@Html.DisplayNameFor(model => model.Movie.ReleaseDate)

</dt>

@Html.DisplayFor(model => model.Movie.ReleaseDate)

</dd>

@Html.DisplayNameFor(model => model.Movie.Genre)

</dt>

@Html.DisplayFor(model => model.Movie.Genre)

</dd>

@Html.DisplayNameFor(model => model.Movie.Price)

</dt>

@Html.DisplayFor(model => model.Movie.Price)

</dd>

</dl>

</div>

<div>

<a asp-page="./Edit" asp-route-id="@Model.Movie.ID">Edit</a> |

</div>

Burada @Html.DisplayNameFor(model => model.Movie.Title) ile model üzerinde isim bilgileri @Html.DisplayFor(model => model.Movie.Title) bu değişkendeki değer bilgileri alınır. Burada ./Edit ifadesi bulunulan klasörü yani bu örnek için Movie klasörünü işaret eder. Edit işlemi PK istediği için asp-route-id=”@Model.Movie.ID” Razor ifadesi etikete eklenmiştir. Tarayıcınızdaki kaynak kodu görüntüle özelliğini kullanarak HTML çıktısı üzerinden dönüşen kodları incelemenizi öneririm.