IRCForumları - IRC ve mIRC Kullanıcılarının Buluşma Noktası
  sohbet

1Beğeni(ler)
  • 1 Post By Kafkef

Yeni Konu aç Cevapla
 
LinkBack Seçenekler Stil
Alt 18 Şubat 2023, 01:12   #1
Çevrimdışı
Kullanıcıların profil bilgileri misafirlere kapatılmıştır.
IF Ticaret Sayısı: (0)
IF Ticaret Yüzdesi:(%)
ASP.NET Mvc ile Ajax Kullanarak Tablo Oluşturmak




İlk olarak, Controller kısmında GetSalesData adında bir metot tanımlanır. Bu metot, SQL veritabanından verileri çekip JSON formatında geri döndürecektir.

PHP Kod:   Kodu kopyalamak için üzerine çift tıklayın!
public ActionResult GetSalesData()
{
    
// SQL bağlantı dizesi
    
string connString ConfigurationManager.ConnectionStrings["DefaultConnection"].ConnectionString;

    
// SQL sorgusu
    
string query "SELECT * FROM Sales";

    
// SQL veritabanı bağlantısı oluştur
    
SqlConnection conn = new SqlConnection(connString);

    
// SQL veritabanı bağlantısını aç
    
conn.Open();

    
// SQL sorgusunu yürüt
    
SqlDataAdapter adapter = new SqlDataAdapter(queryconn);

    
// DataTable nesnesi oluştur
    
DataTable data = new DataTable();

    
// Verileri DataTable'a yükle
    
adapter.Fill(data);

    
// SQL veritabanı bağlantısını kapat
    
conn.Close();

    
// DataTable'ı JSON formatına dönüştür ve geri döndür
    
return Json(new { data data }, JsonRequestBehavior.AllowGet);


Aşağıda satır satır anlatımı bulabilirsiniz:

string connString = ConfigurationManager.ConnectionStrings["DefaultConnection"].ConnectionString;:
Bağlantı dizesi, Web.config dosyasında tanımlanmış olan DefaultConnection adlı bağlantı dizesinden alınır.

string query = "SELECT * FROM Sales";:
Veritabanından okunacak olan sorgu tanımlanır.

SqlConnection conn = new SqlConnection(connString);:
SqlConnection sınıfından bir nesne oluşturulur ve bağlantı dizesi parametre olarak verilir.

conn.Open();:
Bağlantı açılır.

SqlDataAdapter adapter = new SqlDataAdapter(query, conn);:
SqlDataAdapter sınıfından bir nesne oluşturulur ve sorgu ve bağlantı nesneleri parametre olarak verilir.

DataTable data = new DataTable();:
DataTable sınıfından bir nesne oluşturulur.

adapter.Fill(data);:
SqlDataAdapter nesnesi kullanılarak veritabanından veriler okunur ve DataTable nesnesine yüklenir.

conn.Close();:

Bağlantı kapatılır.

return Json(new { data = data }, JsonRequestBehavior.AllowGet);:
Okunan veriler, JSON formatına dönüştürülür ve geri döndürülür.

View kısmında, tablo için sadece başlıklar belirtilir. JavaScript kodu ile, tablo DataTable() yöntemi kullanılarak oluşturulur. ajax özelliği kullanılarak, GetSalesData yöntemi çağrılır ve veriler alınır. columns özelliği, verilerin nasıl gösterileceğini belirler. Ayrıca, footerCallback özelliği ile toplam satırı hesaplanır ve tablonun alt kısmında gösterilir.

PHP Kod:   Kodu kopyalamak için üzerine çift tıklayın!
<table id="salesTable" class="display" style="width:100%">
    <
thead>
        <
tr>
            <
th>ID</th>
            <
th>Date</th>
            <
th>Product</th>
            <
th>Price</th>
            <
th>Quantity</th>
            <
th>Total</th>
        </
tr>
    </
thead>
    <
tfoot>
        <
tr>
            <
th colspan="4">Total:</th>
            <
th id="quantityTotal"></th>
            <
th id="priceTotal"></th>
        </
tr>
    </
tfoot>
</
table

JavaScript kodu, verilerin alınması ve tablo oluşturulması için kullanılır. Aşağıda satır satır açıklaması yer almaktadır:

PHP Kod:   Kodu kopyalamak için üzerine çift tıklayın!
$(document).ready(function () {
    $(
'#salesTable').DataTable({
        
"ajax": {
            
"url""/Home/GetSalesData",
            
"dataSrc""data"
        
},
        
"columns": [
            { 
"data""ID" },
            { 
"data""Date" },
            { 
"data""Product" },
            { 
"data""Price" },
            { 
"data""Quantity" },
            { 
"data""Total" }
        ],
        
"footerCallback": function (rowdatastartenddisplay) {
            var 
quantityTotal 0;
            var 
priceTotal 0;
            for (var 
0data.lengthi++) {
                
quantityTotal += parseFloat(data[i].Quantity);
                
priceTotal += parseFloat(data[i].Price) * parseFloat(data[i].Quantity);
            }
            $(
'#quantityTotal').html(quantityTotal);
            $(
'#priceTotal').html(priceTotal.toFixed(2));
        }
    });
}); 

Aşağıda bu kodun satır satır açıklaması yer almaktadır:


$(document).ready(function () {:
Sayfa yüklendiğinde çalışacak JavaScript kodunu belirtir.

$('#salesTable').DataTable({:

salesTable adlı tablonun, DataTable yöntemi kullanılarak oluşturulacağını belirtir.

"ajax": { "url": "/Home/GetSalesData", "dataSrc": "data" }:
Verilerin alınacağı URL ve alınan verilerin yer alacağı JSON öğesinin adı belirtilir.

"columns": [...]:
Tabloda yer alacak sütunlar belirtilir.

"footerCallback": function (row, data, start, end, display) { ... }:
Footer bölümünde yer alacak toplam hesaplaması yapılır.

Özetle, yukarıdaki kodlar, SQL veritabanından verileri okuyup DataTable nesnesine yükleyerek, bu verileri JSON formatına dönüştürür ve Ajax kullanarak HTML sayfasında görüntüler. Ayrıca, JavaScript kodu kullanarak tablonun altındaki footer bölümünde toplam satırı hesaplar ve görüntüler.

Dip Not: Kodların tamamının sorunsuz çalışması için DataTable, Jquery vb. kütüphanelerini projeye eklemeniz tavsiye ederim. Ben test yaparken bu kütüphaneler vardı. O yüzden gözümden kaçan detaylar olabilir.
Bu forumdaki linkleri ve resimleri görebilmek için en az 25 mesajınız olması gerekir.

 
Alıntı ile Cevapla

IRCForumlari.NET Reklamlar
sohbet odaları sohbet odaları Benimmekan Mobil Sohbet
Cevapla


Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir)
 
Seçenekler
Stil

Yetkileriniz
Konu Acma Yetkiniz Yok
Cevap Yazma Yetkiniz Yok
Eklenti Yükleme Yetkiniz Yok
Mesajınızı Değiştirme Yetkiniz Yok

BB code is Açık
Smileler Açık
[IMG] Kodları Açık
HTML-Kodu Kapalı
Trackbacks are Kapalı
Pingbacks are Açık
Refbacks are Açık


Benzer Konular
Konu Konuyu Başlatan Forum Cevaplar Son Mesaj
[AJAX] VietVBB - Gelişmiş Forum İstatistikleri - [AJAX]VietVBB - Advanced Forum Statistics hAte vB 3.8.x Eklentileri 4 27 Aralık 2021 14:43
Oracle'da Temp Tablo Oluşturmak ve Silmek (Temporary Table) UzmaN Oracle 0 08 Nisan 2019 10:50
mysql ile tablo kopyalama ve tablo adı değiştirme 1 - 2 Kaf_Dağı Delphi 0 18 Mart 2015 14:23
ASP'de iç içe for döngüsü kullanarak çarpım tablosu oluşturmak hAte ASP/ASP.NET 0 19 Ekim 2014 17:34
PHP ve AJAX - Gmail'in Belkemiği: AJAX EGEMAN PHP 3 16 Ekim 2008 13:36