ASP.NET Core Kitap Listeleme Projesi Ders 13

Bu dersimizde de ikinci tanımladığımız alanda oluşturduğumuz Sil butona ait olan işlevlerin gerçekleştirilmesini analatalım. Öncelikle KitapController’a geliyorum. Ve kodlarımı düzenliyorum.

Dersin video versiyonunu izlemenizi tavsiye etmekteyim.

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

namespace KitapListesiProjesi.Controllers
{
    [Route("api/Kitap")]
    [ApiController]
    public class KitapController : Controller
    {
        private readonly KLDbContext _db;

        public KitapController(KLDbContext db)
        {
            _db = db;
        }

        [HttpGet]
        public async Task< IActionResult > GetAll()
        {
            return Json(new { data = await _db.Kitap.ToListAsync() }); 
        }

        public async Task< IActionResult > Delete(int id)
        {
            var DBGelenKitap = await _db.Kitap.FirstOrDefaultAsync(x => x.Id == id);
            'if' (DBGelenKitap == null)
            {
                return Json(new { success = false, message = "Silme işleminde hata oluştu!" });

            }

            _db.Kitap.Remove(DBGelenKitap);
            await _db.SaveChangesAsync();
            return Json (new { success = true, message = "Silme işlemi başarılı" });
        }

    }
}

Not: Kodları doğru görebilmek adına dersin video versiyonunu izlemenizi öneririm. wp ve tarayıcı hatasının aşılabilmesi için if önünde ve sonunda tırnak işareti ve bazı alanlarda boşluklar kullanılmıştır.

Öncelikle Delete metodumu oluşturdum. Asenkronik task tipinde bir metot bu. Öncelikle veritabanından silinecek kitabın id’sine göre verileri aktarabilmek için değişkenimi tanımladım ve gelen kitap verisinin tüm verilerini bu değere atama işlemi yaptım.

Eğer bir veri gelmezse hata mesajı verdiriyorum, eğer veri gelirse işlemlerimi yaptırıyorum. Veritabanından Remove ile kitabı kaldırıyorum ve database tarafıma değişiklikleri SavaChangesAsync metodu ile yansıtıyorum. Akabinde kullanıcıya başarılı mesajını veriyorum.

Buradan javascript dosyama geçiyorum ve burada kitapListesi.js dosyam üzerinde kodlarımı yazıyorum:

using Systvar dataTable;

$(document).ready(function (){
    loadDataTable();
});

function loadDataTable() {
    dataTable = $('#DT_load').DataTable({
        "ajax": {
            "url": "/api/kitap",
            "type": "GET",
            "datatype": "json"
        },

        "columns": [
            { "data": "kitapAd", "width": "20%" },
            { "data": "yazar", "width": "20%" },
            { "data": "isbn", "width": "20%" },
            {
                "data": "id",
                "render": function (data) {
                    return `

                           
                      Düzenle 
                       
                       Sil   
                   
`;

                }, "width": "40%"
            }

        ],

        "language": {
            "emptyTable": "Veri bulunamadı!"
        },

        "width": "100%"
    });
}

function Delete(url) {
    swal({
        title: "Silmek istediğinizden emin misiniz?",
        text: "İlgili veri silinirse tekrar geri döndürülemeyecektir!",
        icon: "warning",
        buttons: true,
        dangerMode: true
    }).then((silinecekmi) => {
        'if' (silinecekmi) {
            $.ajax({
                type: "DELETE",
                url: url,
                success: function (data) {
                    'if' (data.success) {
                        toastr.success(data.message);
                        dataTable.ajax.reload();
                    }
                    else {
                        toastr.error(data.message);
                    }
                }
            })
        }
    })
}

Not: Kodları doğru görebilmek adına dersin video versiyonunu izlemenizi öneririm. wp ve tarayıcı hatasının aşılabilmesi için if önünde ve sonunda tırnak işareti ve bazı alanlarda boşluklar kullanılmıştır.

Not: Javascript dosyalarında referans verme işlemlerinde kodlarım Pages/Shared/_Layout.cshtml tarafında değiştirildi. Son durumu aşağıda paylaşıyorum. Yine video ders içinde ayrıntıyı görebilirsiniz.

Pages/Shared/_Layout kodlarımız:

< !DOCTYPE html >
< html lang="en" >
< head >
    
    
    
    
    

 
    

    




    
    
    @*
    *@
< /head >
< body >
    < header >
        
    
    

        

            @RenderBody()
        
    

    < footer class="border-top footer text-muted">
        

            © 2020 - KitapListesiProjesi - Privacy
        
    < /footer >

    
    
    



    

    



    
    
    @*
    *@

    @RenderSection("Scripts", required: false)
< /body >
< /html >

Not: Kodları doğru görebilmek adına dersin video versiyonunu izlemenizi öneririm. wp ve tarayıcı hatasının aşılabilmesi için if önünde ve sonunda tırnak işareti ve bazı alanlarda boşluklar kullanılmıştır.

Projemde kullandığım javascript ve CSS için adresleri ekliyorum:

Toastr CSS ve JS Linkleri:

https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css

https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js

SweetAlert CSS ve JS Linkleri

https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css

https://unpkg.com/sweetalert/dist/sweetalert.min.js

DataTables:

https://datatables.net/download/

JQuery:

https://cdnjs.com/libraries/jqueryui

Projemize ait görselimiz:

Bu dersimiz bu kadar, video derse mutlaka göz atın, bir sonraki derste görüşmek üzere.