• Buradasın

    ASP.NET MVC ve AJAX ile Veri Listeleme, Sayfalama ve Filtreleme Eğitimi

    youtube.com/watch?v=0opJw6w8mmY

    Yapay zekadan makale özeti

    • Bu video, Yıldırım Söker tarafından sunulan bir yazılım eğitim içeriğidir. Eğitmen, ASP.NET MVC framework ve AJAX kullanarak veri listeleme, sayfalama ve filtreleme işlemlerini adım adım göstermektedir.
    • Video, Nordwind veritabanındaki müşteriler tablosundan veri çekme, sayfalama ve filtreleme işlemlerinin nasıl yapılacağını kapsamaktadır. İçerikte PagedList.Mvc paketinin kullanımı, model sınıfı oluşturma, controller action'ı yapılandırma, AJAX ile sayfalama ve filtreleme işlemleri detaylı olarak anlatılmaktadır. Eğitmen, şehir, firma adı ve ülke gibi filtreleme alanlarını kullanarak dinamik sorgu oluşturma ve partial view'lar ile performans kazanma tekniklerini göstermektedir.
    • Eğitimde ayrıca AJAX.BeginForm kullanarak form oluşturma, jQuery'un PagerList helper'ı ve SQL Server Profiler ile sayfalama işleminin veritabanından sadece gerekli verilerin çekilmesini sağladığı kanıtlama gibi teknik detaylar da yer almaktadır. Video sonunda, eğitmen projeyi indirip inceleyebilme imkanı sunmaktadır.
    00:01MVC ile Veri Listeleme ve Sayfalama
    • Dersin amacı MVC ile veri listeleme, sayfalama ve filtreleme işlemlerini öğrenmektir.
    • Sayfalama işlemi için PagedList helper kullanılarak AJAX üzerinden işlemler gerçekleştirilecektir.
    • Tüm işlemler AJAX üzerinden yapılacaktır ancak JavaScript kodu çok kısa olacak, ağırlıklı olarak helper'lar kullanılaracaktır.
    00:50Proje Yapısı ve Hazırlık
    • Örnekler için Nordwind veritabanı ve içerisindeki Customers tablosu kullanılacaktır.
    • Layout kısmında jQuery script'i render edilmiş durumdadır.
    • View tarafında Customers adında bir partial view ve Controller adında bir kontrolü vardır.
    02:35Model Oluşturma
    • Entity Framework üzerinden Nordwind veritabanına bağlantı yapılmış ve Customers tablosu eklenmiştir.
    • ViewModel adında bir klasör oluşturulmuş ve içerisinde Customer modeli bulunur.
    • Customer model hem sayfalama hem filtreleme ile ilgili işlemleri gerçekleştirecek.
    03:45PagedList Kütüphanesini Kurma
    • PagedList kütüphanesi NuGet.org adresinden indirilmiştir.
    • Package Manager Console üzerinden kütüphane projeye entegre edilmiştir.
    • Kütüphane projeye referans olarak eklenmiş ve sayfalama görünümünü belirleyen CSS dosyası content klasörüne eklenmiştir.
    05:50Model Yapısı
    • Model yapısında firma adı (company name), şehir ve sayfa numarası (page) propertileri oluşturulmuştur.
    • Sayfa numarası alanı boş geçilebilir çünkü ilk sayfa açıldığında boş gelecektir.
    • CustomerList modelinde listeleyecek verilerin propertileri (firma adı, şehir ve ülke) oluşturulmuştur.
    09:50Controller ve Action
    • Tüm işlemler Controller tarafındaki Index action'ta gerçekleştirilecektir.
    • Index action'a parametre olarak daha önce oluşturulan Customer modeli eklenmiştir.
    • Action'ta gelen sorgulama bilgilerini okuyup, Entity Framework üzerinden veri sorgulayıp liste olarak geri döndürecektir.
    11:27Petlist ve Sayfalama İşlemi
    • Petlist kullanmak için referans ediliyor ve Pets ve Pets MC'ye ihtiyaç duyuluyor.
    • Sayfalama yapabilmek için ön taraftan basılan sayfanın numarası gerekiyor ve bunun için "page index" adında bir değişken tanımlanıyor.
    • Modelden gelen verilere göre şekil verilerek sayfalama işlemi gerçekleştirilecek.
    12:16Entity Framework Bağlantısı ve Veri Filtreleme
    • Entity Framework bağlantısı gerçekleştirilecek ve bir class oluşturulacak.
    • Model.Customer ise veri doldurulmalı ve filtreleme sayfalama işlemleri yapılarak model içerisine atılacak.
    • Dinamik bir veri yapısı oluşturulmalı ki sayfa ilk açıldığında filtreler boş gelse bile listeleyebilmesi için.
    13:40Filtreleme İşlemleri
    • Şehir ve firma adı alanlarına göre dinamik filtreleme yapılıyor; alanlar boşsa filtreleme yapılmıyor, doluysa veritabanında arama yapılıyor.
    • "Contains" metodu kullanılarak veritabanında belirli bir kelimenin içerip içermediği kontrol ediliyor.
    • Şehir ve firma adı filtreleri "and" ile birleştirilerek hem şehir hem de firma adı uygun olan veriler listeleniyor.
    15:27Sayfalama ve Veri Dönüşümü
    • Sayfalama işlemleri için "OrderBy" yapısı kullanılmalı, "Desc" veya "Asc" sıralama yapılabilir.
    • Entity Framework'den gelen veriyi model yapısına çevirmek için dönüşüm işlemi yapılıyor.
    • Entity'den gelen veriler model yapısına dönüştürülerek şehir, firma adı ve ülke alanları modelin içine atanıyor.
    17:36Sayfalama ve View Dönüşümleri
    • Sayfalama için bir metot kullanılıyor ve sayfa numarası, sayfa boyutu gibi parametreler belirleniyor.
    • Ajax ile yapılan istekler için tam sayfa değil sadece tablo kısmı dönecek şekilde kontrol yapılıyor.
    • Sayfa ilk açıldığında tam view dönecek, Ajax ile yapılan isteklerde ise parçalı view kullanılacak.
    22:02Toplu İşlem Özeti
    • Arama yapıldığında veya sayfa ilk açıldığında model olarak Customer modeli kullanılıyor.
    • Entity Framework üzerinden veritabanına bağlanıp, model içerisindeki propertilerle customers dolduruluyor.
    • Dinamik yapısı oluşturulup, sayfa numarası ve sayfa boyutu belirlenerek model dolduruluyor.
    23:33AJAX Form Kullanımı
    • Proje başlangıcında AJAX formu kullanarak arama kısmını modelleyeceğiz.
    • Form için action, controller ve metot tipi (POST) belirtiliyor.
    • AJAX seçenekleri arasında sadece "on success" kısmı kullanılacak, başarılı işlemde "loadCustom" adlı JavaScript fonksiyonu çalışacak.
    25:32Modelleme ve HTML Yapısı
    • Daha önce oluşturulan custom modeli kullanarak filtreleme işlemi modelleyeceğiz.
    • HTML inputları HTML helper'larla model yapımıza uygun hale getiriliyor.
    • Buton "input type submit" olarak değiştiriliyor.
    27:45Parçalı View Kullanımı
    • Div içindeki tablo parçalı view'e dönüştürülecek, böylece AJAX isteği yapıldığında sadece tablo geri dönecek.
    • "Customer" adında bir parçalı view oluşturuluyor.
    • Parçalı view içinde "Html.Partial" kullanılarak "Customer" parçalı view çağrılıyor.
    31:18Veritabanından Veri Listeleme
    • Tablo içeriğinin sabit değerler yerine veritabanından gelen verilerle doldurulacağı belirleniyor.
    • "foreach" döngüsü kullanılarak modelin içerisindeki liste dolaşılarak veriler tabloya listeleniyor.
    • Firma adı, şehir ve ülke bilgileri modelden çekiliyor.
    32:44Sayfalama İşlemi
    • Sayfalama için "Html.PagedListPager" kullanılıyor.
    • İlk parametrede modelin içerisindeki IP türünden veri listesi belirtiliyor.
    • Sayfalama için "Url.Action" kullanılarak action name belirleniyor ve arama kriterleri (company name, city) sayfalama yapısında korunuyor.
    36:04AJAX Sayfalama Özellikleri
    • Sayfalama için AJAX özelliği kullanılıyor.
    • "RenderOptions" içinde "EnableSvetsReplace" ve "AjaxOptions" kullanılarak sayfalama yapıldığında değişecek div belirleniyor.
    • "UpdateTargetId" özelliği ile sayfa değiştirildiğinde "ajaxMain" div'inin içeriği güncellenecek.
    39:47AJAX Tablosu ve Sayfalama
    • Veriler AJAX tablosuna doğru şekilde gelmiş ve sayfalama işlemi düzgün çalışıyor.
    • Her sayfada 10 kayıt gösterilmesi isteniyor ve toplamda 91 kayıt bulunmaktadır.
    • TextBox yerine TextBoxFor kullanarak düzenleme yapılmış ve AJAX üzerinde veriler sağlıklı bir şekilde çalışıyor.
    41:50Arama Fonksiyonu Ekleme
    • Arama işlemini gerçekleştirmek için küçük bir JavaScript kodu yazılması gerekiyor.
    • Şehir, ülke ve firma adı gibi filtreleme seçenekleri eklenerek arama yapılabiliyor.
    • JavaScript fonksiyonu, AJAX isteği başarıyla gerçekleştiğinde çalışarak geri dönen veriyi HTML içerisine bastırıyor.
    43:54Filtreleme ve Sayfalama Testi
    • Şehir olarak "Leon" yazıldığında tek bir kayıt, "London" yazıldığında ise 6 kayıt bulunuyor.
    • Firma adı ve ülke gibi farklı filtrelerle arama yapılabiliyor ve sonuçlar AJAX üzerinden sayfalandırılıyor.
    • Tüm işlemler AJAX üzerinden gerçekleştiği için sayfa yenilenmesi yaşanmıyor.
    45:48Kod Analizi ve Debug
    • Debug noktası kullanılarak kodun çalışması inceleniyor ve ilk açılışta hiçbir değer dönmediği görülüyor.
    • Veritabanından ilk 10 kayıt çekiliyor ve sıralama "custom ra" göre tam tersi şekilde yapılıyor.
    • AJAX isteği geldiğinde sadece tablo ve sayfalama kısmı geri döndürülüyor, tam bir view değil.
    50:06Filtreleme İşlemi
    • Filtreleme yaparken şehir adı "Lo" ile başlayan kayıtlar aranabiliyor.
    • Filtreleme yapıldığında model içerisine filtre kriterleri doluyor ve veritabanından sorgu yapılıyor.
    • AJAX isteği geldiğinde, geri dönen veri jQuery ile "ajax main" div'ine basılıyor.
    52:51AJAX ile Filtreleme ve Parçalı Görüntüleme
    • İlk filtreleme işlemi yapıldığında "city = leo" şeklinde bir sorgu oluşturuluyor.
    • Parçalı görüntüleme (partial view) kullanıldığında, sadece arama sonucu için gerekli veriler döndürülüyor, tam sayfa yapısı değil.
    • AJAX isteği geldiğinde, parçalı görüntüleme sadece veri istenen alanın HTML çıktısını döndürüyor.
    54:44Parçalı Görüntüleme Kullanımı
    • Parçalı görüntüleme, AJAX isteği geldiğinde belirtilen div içerisine basılıyor.
    • Sayfa ilk açıldığında parçalı görüntüleme kullanılmıyor, sadece model referans ediliyor.
    • AJAX isteği geldiğinde, parçalı görüntüleme döndürülen HTML çıktısı belirtilen div içerisine basılıyor.
    56:39Sayfalama Performansı
    • Bazı sayfalama paketleri gerçek anlamda sayfalama yapmayabilir, veritabanından tüm veriyi çekip ön tarafta sadece gösterme işlemi yapabilir.
    • Kullanılan sayfalama yöntemi gerçek anlamda sayfalama yapıyor, veritabanından sadece gerekli verileri çekiyor.
    • SQL Server Profiler ile yapılan testte, sorgunun "SELECT TOP 10" ile başladığı ve sadece ilk 10 verinin çekildiği görüldü.
    59:45Dersin Özeti
    • Dersde PagedList kütüphanesi kullanılarak AJAX ile filtreleme işlemleri gösterildi.
    • Parçalı görüntüleme ve AJAX yapısı bilinenler için anlaşılabilecek bir mantıkla geliştirildi.
    • Proje indirilebilir ve geliştirilebilir, örneğin yüklenme animasyonları gibi özellikler eklenebilir.

    Yanıtı değerlendir

  • Yazeka sinir ağı makaleleri veya videoları özetliyor