Datatable Datagrid Satir Kayıtlarını Ekleme

DataTables DataGrid’ine Satır Kayıtları Ekleme

DataTables, web uygulamalarında veri tablolarını görüntülemek ve yönetmek için kullanılan güçlü bir JavaScript kütüphanesidir. DataTables DataGrid, kullanıcıların satır ekleme, silme ve düzenleme gibi etkileşimli işlemler gerçekleştirmesine olanak tanır. Bu makalede, DataTables DataGrid’ine satır kayıtları eklemenin adım adım bir kılavuzunu sunacağız.

Adım 1: DataTables’ı Sayfaya Dahil Etme

DataTables’ı web sayfanıza dahil etmek için aşağıdaki komut dosyalarını ekleyin:

“`html

“`

Adım 2: Tabloyu Oluşturma

Satır eklemek istediğiniz tabloyu oluşturun. Örneğin:

“`html


Ad Soyad E-posta

“`

Adım 3: DataTables’ı Tabloya Başlatma

DataTables’ı tabloya başlatmak için aşağıdaki kodu kullanın:

javascript
$(document).ready(function() {
$('#example').DataTable();
});

Adım 4: Satır Ekleme Düğmesi Oluşturma

Satır eklemek için bir düğme oluşturun. Örneğin:

html
<button id="add-row" class="btn btn-primary">Satır Ekle</button>

Adım 5: Satır Ekleme İşlevini Yazma

Satır ekleme işlevini düğme tıklama olayına ekleyin. Örneğin:

“`javascript
$(‘#add-row’).click(function() {
// Yeni satır verilerini alın
var name = $(‘#name’).val();
var surname = $(‘#surname’).val();
var email = $(‘#email’).val();

// Yeni satırı oluşturun
var newRow = ‘

‘ + name + ‘ ‘ + surname + ‘ ‘ + email + ‘

‘;

// Yeni satırı tabloya ekleyin
$(‘#example’).DataTable().row.add($(newRow)).draw();
});
“`

İpuçları

  • Yeni satır verilerini almak için form öğelerini kullanabilirsiniz.
  • Satır ekleme işlevini daha özelleştirmek için DataTables API’sini kullanabilirsiniz.
  • Satır ekleme işlemini daha kullanıcı dostu hale getirmek için modal pencereler veya açılır menüler kullanabilirsiniz.

Faydalı Kaynaklar

Sonuç

Bu kılavuzu izleyerek, DataTables DataGrid’inize kolayca satır kayıtları ekleyebilirsiniz. Bu, kullanıcıların verileri dinamik olarak yönetmesine ve uygulamalarınızın işlevselliğini artırmasına olanak tanır.

Yayımlandı

kategorisi