Asp.net Mvc Jquery DataTable Entegrasyonu

Bu makalemde sizlere asp.net mvc'de jquery datatable entegrasyonunu anlatmaya çalışacağım.

JqueryDataTableExamp isimli boş bir mvc projesi açıyoruz.



Sıra geldi DataTables referencelarımızı Nuget dan indirmeye 
projemize sağ tıklıyor Manage Nuget Packages'ı açıyoruz.

Karşımıza çıkan ekrandan sağ taraftaki arama ekranına datatables yazıp aratıyoruz.Karşımıza ilk şıan DataTables kütüphanesini indiriyoruz.

İnirme işlemi bittikten sonra Script klasörümüze jquery ve datatable kütüphanelerimiz geliyor.

Birtane HomeController ekliyoruz ve Index view i ekliyoruz.

Ben örnek proje olduğu için Model klasörüne entity nesnesini ve Model View arasında haberleşecek

DataTableModel nesneyi ekledim.

Customer ise entity nesnem 

Static olarak oluşturacağımız data sayısı

Type a göre kullanacağımız Compare Methodlarımızı yazdık

İstek yapıldığında datamızı filtreleyecek method 'umuz

Wher koşullarımızı belirlemek için Function yazdık

Kolona tıklandığında hangi kolondan geldiğinin index ini aldık ve kolon'a göre Sort işlemlerimizi kontrol ederek yaptık

Eğer kullanıcı serach kutusundan arama yaptıysa filter function'ı null olmaz bu durumda where koşulu uygulanır eğer search yapılmamışsa where koşulu uygulanmadan data direk gelir.

View tarafında scriptlerimizi reference gösterdik isterseniz bundle yapabilirsiniz ben direk yazdım

example id li table ımızı oluşturduk 

​

Sıra geldi datatable ı bağlamaya. İstek yapılacak Action ımızı ve kolonlarımızı belirledik.

Ve muulu son :)




 

Download Project

Umarım faydalı bir makale olmuştur. Kolay Gelsin Hepinize