Tablo sütun filtreleme ve toplama işlemi

SkyGod

Hectopat
Katılım
14 Temmuz 2018
Mesajlar
134
Daha fazla  
Cinsiyet
Erkek
Datatables kullanarak bir tablo oluşturdum ve her sütun başına filtreleme koydum ama düzgün çalışmıyor. 1 yazıyorum 11 101 gibi şeyler de buluyor. Tarih bölümünde de 26 Nisan yazıyorum saat ve dakikadaki 26'yı buluyor. Ayrıca bana filtreleme yaptıkça çıkan adetlerin toplamı da lazım datatables bunu güzel yapıyor ama filtrelemesi sıkıntı yaratıyor. Başka kullanabileceğim datatables benzeri bir kod var mı?

1657980252266.png
 
Çünkü filtreleme direkt eşleşmeye göre değil, içerisinde geçene bakıyor. Yani içerisinde "1" olan tüm verileri önünüze getiriyor. Daha zeki filtreleme için, custom filter oluşturmalısın diye biliyorum.

Baktım ama sadece seçerek filtreleme ile ilgili şeyler çıkıyor. Benim yazarak filtrelemeye ihtiyacım var.
 
Baktım ama sadece seçerek filtreleme ile ilgili şeyler çıkıyor. Benim yazarak filtrelemeye ihtiyacım var.

Anladım. Bunu dener misin?

JavaScript:
var table = $('#example').DataTable();

$('.dataTables_filter input').unbind().bind('keyup', function() {
   var searchTerm = this.value.toLowerCase(),
       regex = '\\b' + searchTerm + '\\b';
   table.rows().search(regex, true, false).draw();
})
 
Bu işlem için şu şekilde bir fonksiyon yazmıştım. Parametre olarak datatables yaptığın elemanın selectorünü veriyorsun ve arama inputları ekleniyor. Senin ekstra eklemene gerek yok.

JavaScript:
function datatablesColumnSearch(selector) {
    const lineId = selector + "-search-inputs";

    $(lineId).remove();

    const table = document.querySelector(selector);
    const thead = table.querySelector("thead");
    const heads = thead.querySelectorAll("tr:first-child th");

    const searchHead = document.createElement("tr");
    searchHead.id = lineId;

    heads.forEach((head, i) => {
        const style = window.getComputedStyle(head);
        if (style.display !== "none") {
            const cell = document.createElement("th");
            cell.className = "p-1";

            const column = dataTable.column(i);
            if (dataTable.settings()[0].aoColumns[i].bSearchable) {
                const input = document.createElement("input");
                input.placeholder = "Arayın";
                input.className = "form-control form-control-sm";
                cell.appendChild(input);

                $(input).on("keyup change clear", function () {
                    if (column.search() !== this.value) column.search(this.value).draw();
                });
            }

            searchHead.appendChild(cell);
        }
    });

    thead.appendChild(searchHead);
}
 
Anladım. Bunu dener misin?

JavaScript:
var table = $('#example').DataTable();

$('.dataTables_filter input').unbind().bind('keyup', function() {
   var searchTerm = this.value.toLowerCase(),
       regex = '\\b' + searchTerm + '\\b';
   table.rows().search(regex, true, false).draw();
})
Dediğiniz kodu yaptım ama sütun başına arama değil sağ üstteki genel arama bölümünde aratıyor bu da bana tüm sütundaki sonuçları getiriyor
 

Geri
Yukarı