Derinlemesine yazılım eğitimleri için kanalımı takip edebilirsiniz...

MVC’de Tablo Sayfalama

Üzerinde çalıştığımız bir projenin, herhangi bir sayfasında veritabanındaki bilgileri, tablolamayla listelettiğimiz zamanlar oluyor.Bu durumlarda veritabanımızın yoğunluğuna bağlı olarak, verilerin hepsini, anında göstermekten ziyade, belirli parça gruplar halinde listeletip, sayfalama yoluyla bu gruplara ulaşırız.Bu yazımızda bu işlemin nasıl yapıldığını detaylı bir şekilde irdeleyeceğiz.

Örnek olarak kendi oluşturduğum “Sayfalama” adındaki veritabanını kullanacağım.”Verilerim” tablosunda 1000 tane kayıt mevcuttur.
Verilerim

İlk iş olarak bir MVC projesi oluşturuyorum ve gerekli işlemleri yaparak bu verileri tabloda listeliyorum.
verilerimlistesi

Listelenen tablonun tam görüntüsünü göstermek mümkün değil.Ancak yukarıdaki görüntüde verilerimizi MVC projesinde tabloda listelediğimizi görüyorsunuz.

Tablomuzda 1000 adet veri bulunmaktadır.Bu verileri bir düzen nizama göre gruplayıp, sayfalayacağım.Verilerimizi gruplarken, bir grup içindeki veri sayısı 25 olacaktır.Yani bu tablomuzda en fazla 25 veri gözükecektir.Sayfamız ilk açıldığında tablomuzda, veritabanımızdaki ilk 25 veri listelenecektir.Diğer veriler ise, sayfalama yapılarak her bir sayfada 25 veri saklanacak mantığıyla çekilecektir.Eğer veritabanımızda 25 veriden az veri bulunuyorsa, bunlar direkt olarak tabloda listelenecek.25 ten fazlası bulunuyorsa, ilk 25 i alınıp listelenecek, geri kalanı sayfalanacaktır.Her bastığımız sayfada, arkaplanda ki programatik işleyişe göre bir sonraki 25 veri getirilecektir.

Sayfalama işlemini yapmak için bir HtmlHelper tipinde Extension metod yazacağız.Bu sınıf sayesinde, tablomuzun altında gerekli sayfalama linkleri oluşturulacaktır.

    public static class HtmlHeplerSayfala
    {
        public static string Sayfala(this HtmlHelper Html, int ToplamSayfa)
        {
            UrlHelper URL = new UrlHelper(Html.ViewContext.RequestContext, Html.RouteCollection);
            /*
             Bu metodumuz çok esnek yapıda olacağı için, dinamik olarak kullanıldığı sayfadaki
             controller ve action adını kendisi alacaktır.Yukarıdaki referans adı URL olan
             UrlHelper tipindeki nesnemiz bize adres çubuğundaki URL yapısını dönecektir.
             */
            string ControllerAdi = URL.RequestContext.RouteData.Values["controller"].ToString();
            /*
             Bu kod ile yapılan işlem ise, Sayfala metodunun kullanıldığı sayfada URL nesnemize
             gelen URL yapısındaki "controller" değişkeninin değerini alıyoruz.Bu "controller"
             adındaki değişkenimiz, Global.asax dosyasındaki URL yapımızdaki değişken ismidir.
             */
            int SayfaNumarasi = int.Parse(URL.RequestContext.RouteData.Values["sayfano"].ToString());
            /*
             Bu satırda ise, o anda bulunduğumuz sayfa numarasını elde ediyoruz."sayfano" değişkenimiz
             yazımızın devamında Global.asax dosyasındaki URL yapısına eklenecektir.
             */

            StringBuilder sb = new StringBuilder();
            //Oluşturacağım sayfalama komutlarını oluşturup, bu nesnemizle teker teker birleştireceğim.
            if (SayfaNumarasi != 1)
            {
                string IlkSayfa = "<a href=" + URL.Action(">İlk Sayfa</a>";
                /*Eğer sayfa numaramız 1 değilse, yani ilk sayfada değilsek, "İlk Sayfa" adında bir
                 link oluşturuyorum.Bu metodumuzun kullanıldığı sayfanın Controller katmanında ki
                 "Index" adındaki ActionResult tipinden metodumuz gösterecektir.Yazının devamında
                 bu metodu da oluşturacağız.Ve bu oluşturulan linkin "sayfano" değişkenine
                 1 değerini atayacaktır.
                 */
                sb.Append(IlkSayfa);
                //IlkSayfa değişkenimizdeki link yapısı StringBuilder nesnemize eklendi.
sb.Append("|");

                string OncekiSayfa = "<a href=" + URL.Action(">Önceki Sayfa</a>";
                //Ayno şekilde, bir önceki sayfa linkinide oluşturdum.
                sb.Append(OncekiSayfa);

                sb.Append("...&nbsp&nbsp");
                //Sayfa numaralarını yazdıracağımızdan dolayı, biraz boşluk bıraktık.
            }

            for (int i = (SayfaNumarasi >= 7 ? (SayfaNumarasi - 5) : 1); i < ((SayfaNumarasi + 5) < ToplamSayfa ? (SayfaNumarasi + 5) : ToplamSayfa); i++)
            {
                /*
                 Sayfalama işleminde kullanacağımız numaraları yazdırırken bu for döngüsünden yararlanacağız.
                 Burada o anki sayfa numaramız 7 den büyük ya da eşitse eğer, sayfa numaramızdan 5 eksik
                 numaradan, sayfa numaralarını yazacaktır.Aksi durumda 1 rakamından başlayacaktır.

                 Sayfa numaramızın 5 fazlası toplam sayfa sayısını geçmiyorsa  eğer, sayfa numaramızın 5 fazlasına
                 kadar döngümüzü döndüreceğiz.Aksi durumda, toplam sayfa sayısına kadar dönecektir.
                 */

                if (i == SayfaNumarasi)
                {
                    sb.Append(i);
                    /*
                     O anki bulunduğumuz sayfanın link değeri yazılmasın.Sadece sayfa numarası yazsın.
                     */
                    sb.Append("&nbsp&nbsp");

                    continue;
                    //Diğer sayfaları oluşturması için continue edip, bu döngünün bu seferki akışını başa alıyorum.
                }

                var SayfaNumarasiLinki = Html.ActionLink(i.ToString(), "Index", new { sayfano = i });
                /*
                 O anki bulunduğumuz sayfa dışındaki linklerimizi oluşturalım.Html parametremizin
                 ActionLink metodunu kullanmak için System.Web.Mvc.Html kütüphanesini sayfamıza
                 eklemeliyiz.
                 */

                sb.Append(SayfaNumarasiLinki);
                sb.Append("&nbsp&nbsp");
            }

            if (SayfaNumarasi != ToplamSayfa)
            {
                sb.Append("...&nbsp&nbsp");
                string SonrakiSayfa = "<a href=" + URL.Action(">Sonraki Sayfa</a>";
                //Sonraki sayfa linkimizi oluşturduk.
                sb.Append(SonrakiSayfa);

                sb.Append("|");

                string SonSayfa = "<a href=" + URL.Action(">Son Sayfa</a>";
                //Son sayfa linkimizi de oluşturduk.
                sb.Append(SonSayfa);
            }

            return sb.ToString();
        }
    }

Gördüğünüz gibi Extension metodumuzu oluşturuk.Metod içeriğini kodlar arasında izah ettiğim için burada değinmeyeceğim.Şimdi bu metodun içinde kullandığımız URL değişkenleri, Global.asax dosyasında bir inceleyelim.

            routes.MapRoute(
                "Default", // Route name
                "{controller}/{action}/{sayfano}/{id}", // URL with parameters
                new { controller = "Home", action = "Index", id = UrlParameter.Optional, sayfano = UrlParameter.Optional } // Parameter defaults
            );

Gördüğünüz gibi, “sayfano” değişkenimizi URL yapımızın içine yerleştirdik.

Şimdi Extension metodumuzu tablomuzun sayfasında kullanalım.

<%= Html.Sayfala(int.Parse(ViewData["ToplamSayfa"].ToString())) %>

Örneğimizde Controller sınıfını gösterme gereği duymadım ama şunu söyleyeyim ki, “Index” isimli Action metodu sayesinde tablomuzu oluşturdum.Yukarıdaki kodu incelerseniz eğer, ViewData[“ToplamSayfa”] değişkenine, toplam sayfa değerini Index Action’ından vereceğiz.

        VeritabaniDataContext Veri = new VeritabaniDataContext();

        public ActionResult Index(int sayfano)
        {
            sayfano--;
            int SayfaBoyutu = 25;
            //Her sayfada 25 veri listelenecek.
            int VeriBoyutu = Veri.Verilerims.Count();
            //Ne kadar verimiz olduğunu öğreniyoruz.
            int ToplamSayfa = (int)Math.Ceiling(VeriBoyutu / (double)SayfaBoyutu);
            //Bu işlem sayesinde kaç adet sayfamız olacağını hesapladık.
            var List = Veri.Verilerims.Skip(sayfano * SayfaBoyutu).Take(SayfaBoyutu);
            /*Skip metodu atlama, Take metodu ise alma anlamına gelmektedir.
             Skip içinde belirtilen değer kadar atla, Take içindeki değer kadarını
             al anlamına geliyor.
             */
            ViewData["ToplamSayfa"] = ToplamSayfa;
            return View(List);
        }

Yukarıdaki kodları incelerseniz eğer, Index Action’ında son toplam sayfa değeri hesaplanıp, Extension metoda parametre olan ViewData[“ToplamSayfa”] değişkenine veriliyor.Artık bütün işlemlerimiz bitmiştir.

Projemizi çalıştırırsak eğer, tablo sayfalamanın tam kıvamında çalıştığını göreceksiniz.

sayfalamaBu yazımında sonuna gelmiş bulunmaktayız.Artık MVC’de rahatlıkla sayfalama işlemlerini yapabilirsiniz.
Bir sonraki yazımda görüşene denk hoşçakalın.

İyi çalışmalar…

Bunlar da hoşunuza gidebilir...

3 Cevaplar

  1. Ahmet dedi ki:

    Hocam bunu asp.net api ile bağladığımız angular projesinde nasıl yaparız? Verilerin 20 tanesi gözükecek diğerleri sayfalama yapılıp o şekilde gösterilecek.

    • Ahmet dedi ki:

      Hocam eklemeyi unuttum angular js olan değil google’nin geliştirdiği angular.

      • Gençay dedi ki:

        Slice Pipe İle Sayfalama başlıklı makalemi okumanızı tavsiye ederim.
        Ayriyetten nacizane tavsiyem, bu şekilde bir sayfalama senaryosunda sayfa başına hedef verileri getirecek bir LINQ sorgusu yahut SQL yapılanması oluşturmanızı performans açısından tavsiye ediyorum.
        Kolay gelsin.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir