Skip to content

Releases: CilginYazilim/bulk-actions-table

Secure DataTables Bulk Actions v1.1.0

Choose a tag to compare

@CilginYazilim CilginYazilim released this 30 Aug 05:39

Mobil deneyim ve seçim ergonomisi sürümü. Toplu işlem çekirdeği (scope=selected / scope=filtered, bulk_preview, expected_count freni) v1.0.0'daki gibi çalışmaya devam ediyor; bu sürümde PHP tarafında tek satır değişiklik yok.

📱 Mobil: tablo, telefonda tablo olmamalı

Sekiz sütunlu tablo telefonda overflow-x: auto ile yatay kaydırılıyordu. Teknik olarak çalışıyordu, pratikte kullanılamıyordu: kullanıcı ad-soyadı görürken durumu ve işlem düğmelerini göremiyordu.

Toplu işlemin ön koşulu satırı tanıyabilmektir. Hangi kaydı işaretlediğini görmeden onay veren kullanıcı, aslında onay vermiş sayılmaz.

  • Kart görünümü< 768px altında her <tr> bir karta dönüşür. Sütun başlıkları data-label ile her hücrenin üstüne yazılır (table.js rowCallback). Tek bir HTML çıktısı iki yerleşimi de besler; sunucuda "mobil mi?" kararı verilmez.
  • Ekranın altına sabitlenen toplu işlem çubuğu — çubuk akış içinde tablonun üstündeydi; listeyi kaydıran kullanıcı seçim yaptığında onu göremiyordu. Görünmeyen bir eylem çubuğu, olmayan bir eylem çubuğuyla aynı şeydir. env(safe-area-inset-bottom) ve body alt boşluğu dahil.
  • Mobil sıralama listesi ve mobil "sayfadaki tümünü seç"<thead> gizlendiğinde kaybolan iki denetimin karşılığı.
  • Araç çubuğu dar ekranda alt alta dizilir (eskiden nowrap + yatay kaydırma idi).
  • Dokunma hedefleri ≥ 44px; modal alanları 16px (iOS Safari'nin otomatik yakınlaştırmasını kapatır); mobil sayfalama düzeni sayfalama → bilgi → uzunluk.

Ölçülüp kapatılan mobil sorunlar

Sorun Sonuç
DataTables'ın <table> etiketine yazdığı satır içi genişlik kart yerleşiminde yatay taşmaya yol açıyordu Durum rozeti ve işlem düğmeleri ekran dışında kalıyordu → düzeltildi
.cy-actions inline-flex olduğu için justify-content onu hizalamıyordu İşlem düğmeleri kartın solunda kalıyordu → text-align ile düzeltildi
Etiket/değer çiftleri alt alta yazılıyor, kart ~290px'e uzuyordu Yan yana dizildi, kart ~200px; aynı ekranda bir kayıt daha görünüyor

⌨️ Arayüz geliştirmeleri

  • Shift + tık ile aralık seçimi. Olay change yerine click dinlenir — change olayı shiftKey bilgisini taşımaz.
  • Seçili satır göstergesi (.cy-row-selected) — masaüstünde zemin rengi, mobil kartta sol kenarda marka mavisi şerit.
  • Esc seçimi bırakır. Bir modal açıkken Esc Bootstrap'e bırakılır.
  • Açık / koyu tema düğmesi. Tercih, sayfa çizilmeden <head> içindeki satır içi betikle uygulanır (FOUC yok) ve localStorage'a kaydedilir. Hiç dokunulmazsa karar işletim sistemine kalır (prefers-color-scheme).

🐞 Düzeltmeler

  • "Seçimi Temizle" yarım çalışıyordu. İç durumu (selectedIds) boşaltıyor ve çubuğu gizliyordu, ama ekrandaki kutucuklar işaretli kalıyordu — seçim temizlendikten sonra tablo hâlâ "10 satır seçili" gibi görünüyordu.
  • Koyu temada toplu işlem sayacı okunmuyordu. Sabit --cy-brand-700 (koyu lacivert), koyu temada koyulaşan zemine düşüyordu. Artık temayla dönen --cy-text kullanılıyor.

📚 Diğer

  • Altbilgiye kütüphane bağlantıları eklendi: Örnek Kodlar & Kütüphane, bu örneğin anlatımı ve GitHub deposu.
  • README.md / README.en.md güncellendi: mobil bölümü, arayüz geliştirmeleri, sürüm geçmişi ve iki mobil ekran görüntüsü (açık + koyu tema).

Kurulum: cy_bulk.sql dosyasını içe aktarın, system/config.php içindeki veritabanı bilgilerini düzenleyin, canlıya alırken APP_DEBUG değerini false yapın.

Daha fazla örnek kod: cilginyazilim.com/kutuphane

Secure DataTables Bulk Actions v1.0.0

Choose a tag to compare

@CilginYazilim CilginYazilim released this 18 Aug 02:03

Initial stable release of a secure PHP + MySQL DataTables bulk actions example.

Features

  • DataTables server-side processing
  • Multi-row selection
  • Select all matching filtered records
  • Gmail-style filtered selection
  • Bulk status updates
  • Bulk deletion
  • Real database count before confirmation
  • Expected count validation
  • Transaction-based bulk operations
  • CSRF protection
  • SQL injection protection
  • XSS protection
  • LIKE wildcard escaping
  • Whitelisted sorting columns
  • Input validation
  • PDO + MySQL
  • Bootstrap 5
  • AJAX-based operations

Security

The project prevents accidental bulk operations by validating the real database count before confirmation and comparing it again when the operation is executed.

If the number of affected records changes between preview and confirmation, the operation is rejected with HTTP 409 and no changes are committed.

Performance

The project includes measured MySQL indexing improvements using a dataset of more than 123,000 records.

Indexed sorting reduced measured query time from hundreds of milliseconds to approximately 1 ms for the tested ORDER BY queries.

Full Changelog: https://github.com/CilginYazilim/bulk-actions-table/commits/v1.0.0