Ringkasan Fitur Final - HTML Tabel Interaktif CSV/XLSX
📄 Ringkasan Fitur Final - HTML Tabel Interaktif CSV/XLSX
✅ Ringkasan Umum
- Fitur "Search" selalu tampil dari awal, bahkan sebelum file diunggah.
- Scroll vertikal & horizontal aktif.
- Lebar header otomatis menyesuaikan isi file unggahan.
- Tidak ada pagination: fitur "Show entries" disembunyikan.
- Tampilan tetap bersih meskipun belum ada file diunggah.
- Tidak perlu reload ulang halaman setelah unggah.
📥 Tahap Dasar (Tampilan & Format)
- Dukungan unggahan file
.csv
dan.xlsx
. - Tabel langsung terbentuk dengan benar setelah unggahan.
- Menyesuaikan semua baris agar kolomnya seragam (menghindari error "Incorrect column count").
- File dengan baris kosong atau tidak rata tidak menyebabkan error.
- Header kolom yang kosong atau tidak unik tetap bisa diproses.
- Menghitung jumlah kolom maksimum (
maxCols
). - Tombol “Muat Ulang” disediakan untuk refresh data unggahan atau kembali ke awal data unggahan.
- Ubah Format Angka:
- Dropdown pilihan: Tanpa desimal (tetap desimal asal), 1 desimal, 2 desimal, Bulat.
- Pilih kolom numerik dengan dicentang setelah pilih File excel kemudian tekan fitur terapkan format angka.
✏️ Tahap Edit Interaktif
- Edit langsung tiap sel menggunakan
contenteditable
atau plugin DataTables Cell Edit. - Baris Editan:
- Copy Baris
- Paste Baris
- Hapus Baris
- Tambah Baris Sebelum
- Tambah Baris Sesudah
- Kolom Editan:
- Copy Kolom
- Paste Kolom
- Hapus Kolom
- Tambah Kolom Kiri
- Tambah Kolom Kanan
💾 Tahap Penyimpanan & Ekspor
- Simpan semua hasil editan ke dalam memori sebelum melakukan ekspor.
- Opsional: Tampilkan pratinjau hasil editan sebelum diekspor.
- Ekspor tanpa editan: Menghasilkan file asli tanpa perubahan dalam format:
.csv
,.xlsx
,.pdf
, atau.html
. - Ekspor dengan editan:
- Seluruh data (termasuk yang diedit dan tidak diedit):
.xlsx
.csv
.pdf
(menggunakanjsPDF
+autoTable
).html
- Data terpilih (hanya kolom atau baris tertentu):
.xlsx
.csv
.pdf
(menggunakanjsPDF
+autoTable
).html
- Seluruh data (termasuk yang diedit dan tidak diedit):
🪄 Tahap Lanjutan (Undo/Redo)
- Dukungan fitur Undo dan Redo editan.
- Gunakan array
history[]
danredo[]
untuk mencatat aksi seperti:- Edit sel
- Tambah/hapus baris
- Tambah/hapus kolom
- Tombol Undo dan Redo aktif secara otomatis sesuai aksi.
Comments
Post a Comment