Javascript / JQuery Grid dinamis terbaik [ditutup]

87

Saya bekerja dengan JavaScript, JQuery dan HTML. UI Proyek saya benar-benar dinamis. Saya mencari Javascript / JQuery Grid dinamis yang mendukung fitur-fitur berikut.

Adakah yang bisa memberi tahu saya apakah ada Grid sumber terbuka yang bagus yang mendukung fitur-fitur berikut?

  1. Saya harus dapat membuat contoh grid pada saat run-time dan menambahkan ke DOM.
  2. Mendukung templat kolom (kotak teks, pilih, kotak centang atau masukan atau teks sederhana)
  3. Mendukung mengatur template kolom baru atau mengganti template kolom yang ada secara real-time.
  4. Beberapa kontrol input (misalnya kotak teks, kotak centang ..) yang ada di bawah kolom dapat diaktifkan dan beberapa mungkin dinonaktifkan .
  5. Mendukung setData () secara real-time.
  6. Mendukung acara jika ada data input yang diubah oleh pengguna.
  7. Ini harus mendukung pemilihan Row
  8. Tambahkan baris atau hapus dukungan baris secara real-time tanpa merender seluruh kisi.
  9. Mendukung Paging.
  10. Mendukung pengurutan berdasarkan kolom apa pun secara real-time.
  11. Menyulut peristiwa jika data diurutkan berdasarkan pengguna secara real-time.
  12. UI kisi harus mendukung kolom yang dapat direalisasikan
  13. Ukuran ulang otomatis (Akan lebih bagus jika kisi diubah ukurannya secara otomatis sesuai dengan ukuran elemen induk)
  14. Pasti punya dokumentasi yang bagus.
javascript jquery grid Somnath
sumber
7
Tulis sendiri. Jika Anda menginginkan semua fitur itu, Anda perlu melakukannya sendiri. Solusi khusus selalu merupakan solusi terbaik.
Raynos
28
Saya tidak yakin itu selalu merupakan solusi terbaik. Maksud saya - saya tidak akan membuat mesin database saya sendiri daripada menggunakan InnoDB ...
Grim ...
2
@ Roynos, Saya telah menulis beberapa hal sendiri tetapi saya perlu menginvestasikan banyak waktu untuk mengimplementasikan semua fitur seperti menyortir, mengubah ukuran ... dll .. jadi saya mencari kontrol grid. Saya masih mengevaluasi semua kisi satu per satu.
Somnath
22
@Raynos Itu konyol. Solusi terbaik adalah solusi yang bekerja dengan biaya terendah. Mengapa membangunnya jika sudah selesai?
richard
@RichardDesLonde Anda benar. Pilihan saya adalah memilih solusi terbaik yang ada dan memperluasnya sesuai dengan kebutuhan Anda.
Somnath

Jawaban:

42

Beberapa yang bermanfaat adalah:

Gratis:

Dibayar:

Entri terbaik menurut saya adalah Flexigrid dan jQuery Grid.

Soham
sumber
Sampai sekarang saya mulai menyukai jQuery Grid. trirand.com/blog/jqgrid/jqgrid.html Tapi saya masih belum yakin. Terus kabari Anda ...
Somnath
@Somnath - Apakah jQuery grid yang paling Anda sukai? Saya memiliki kebutuhan yang sama, dan telah mengevaluasi Tabel Data, tetapi menambahkan baris (dan menjadikannya bagian dari urutan sortir) tidak berfungsi dengan baik.
MattW
@MattW Ya saya suka jQuery Grid, Menambahkan data sangat mudah. Anda juga dapat membuat setiap kolom dapat diurutkan hanya dengan menyetel bendera. Daftar persyaratan saya sangat besar. Tetapi beberapa hal yang saya bangun sendiri dan untuk beberapa kasus saya menggunakan jQuery Grid. Itu juga memiliki API yang keren dan mudah. Saat ini saya senang dengan jQuery Grid. Ini baik.
Somnath
@Somnath Jadi, akhirnya yang mana yang Anda pilih? Saya header DataTable juga merupakan pilihan yang baik. Mana yang tercepat? Dan mana yang mendukung pengelompokan?
Vivek Vardhan
@VivekVardhan im menggunakan trirand.com/blog/jqgrid/jqgrid.html
Somnath
38

Anda dapat mencoba http://datatables.net/

DataTables adalah plug-in untuk pustaka Javascript jQuery. Ini adalah alat yang sangat fleksibel, berdasarkan fondasi peningkatan progresif, yang akan menambahkan kontrol interaksi lanjutan ke tabel HTML mana pun. Fitur utama:

  • Panjang halaman variabel
  • Pemfilteran sambil jalan
  • Penyortiran multi-kolom dengan deteksi tipe data
  • Penanganan lebar kolom yang cerdas
  • Menampilkan data dari hampir semua sumber data
  • DOM, Javascript array, file Ajax dan pemrosesan sisi server (PHP, C #, Perl, Ruby, AIR, Gears dll)
  • Opsi gulir untuk area pandang tabel
  • Sepenuhnya dapat di internasionalisasi
  • Dukungan jQuery UI ThemeRoller
  • Sangat kokoh - didukung oleh 2600+ unit tes
  • Berbagai macam plug-in inc. TableTools, FixedColumns, KeyTable, dan lainnya
  • Gratis!
  • Tabungan negara
  • Kolom tersembunyi
  • Pembuatan tabel yang dinamis
  • Ajax memuat data secara otomatis
  • Penentuan posisi DOM kustom
  • Pemfilteran kolom tunggal
  • Jenis pagination alternatif
  • Interaksi DOM yang tidak merusak
  • Menyortir kolom penyorotan
  • Opsi sumber data lanjutan
  • Dukungan plug-in yang ekstensif
  • Penyortiran, deteksi tipe, fungsi API, pagination, dan pemfilteran
  • Sepenuhnya dapat diberi tema oleh CSS
  • Dokumentasi yang solid
  • 110+ contoh yang dibuat sebelumnya
  • Dukungan penuh untuk Adobe AIR
tertutup
sumber
3
Harap lakukan pemformatan yang benar untuk fitur utama. Jangan gunakan hanya salin / tempel. Harus membacanya sekali setelah salin / tempel?
Apa yang dimaksud dengan "Interaksi DOM non-destruktif"? Sulit memahami mengapa ini novel atau fitur, dan apa yang dicakup / dijaminnya.
John Zabroski
1
@John itu tidak disebutkan lagi di halaman tertaut, tetapi jika Anda menelusuri web untuk kalimat itu, Anda akan menemukan "Perubahan terbesar di v1.4 adalah interaksi DOM yang tidak merusak. Artinya, Tabel Data tidak akan menimpa elemen tabel untuk menjalankan fungsinya (peningkatan progresif sejati!), alih-alih memindahkan elemen. Dalam v1.3 dan sebelum secara dinamis membuat HTML yang diperlukan untuk tbody pada setiap undian, ini tidak lagi terjadi. Keuntungan langsungnya adalah bahwa semua atribut (kelas dll) pada tabel asli dipertahankan [...] "
CodeCaster
5
Ini bukan perangkat lunak gratis. Saya rasa, mmm, ada masalah dengan itu.
David
4
Tampaknya kisi DataTables yang keren ini tidak dapat diedit, dan jika Anda membutuhkannya - Anda harus membayar untuk versi yang dapat diedit: editor.datatables.net/purchase/index
yetanothercoder
8

Saran saya untuk JQuery Grid dinamis ada di bawah.

http://reconstrukt.com/ingrid/

https://github.com/mleibman/SlickGrid

http://www.datatables.net/index

Yang terbaik adalah:

DataTables adalah plug-in untuk pustaka Javascript jQuery. Ini adalah alat yang sangat fleksibel, berdasarkan fondasi peningkatan progresif, yang akan menambahkan kontrol interaksi lanjutan ke tabel HTML mana pun.

Panjang halaman variabel

Pemfilteran sambil jalan

Penyortiran multi-kolom dengan deteksi tipe data

Penanganan lebar kolom yang cerdas

Menampilkan data dari hampir semua sumber data

DOM, Javascript array, file Ajax dan pemrosesan sisi server (PHP, C #, Perl, Ruby, AIR, Gears dll)

Opsi gulir untuk area pandang tabel

Sepenuhnya dapat di internasionalisasi

Dukungan jQuery UI ThemeRoller

Sangat kokoh - didukung oleh 2600+ unit tes

Berbagai macam plug-in inc. TableTools, FixedColumns, KeyTable, dan lainnya

Pembuatan tabel yang dinamis

Ajax memuat data secara otomatis

Penentuan posisi DOM kustom

Pemfilteran kolom tunggal

Jenis pagination alternatif

Interaksi DOM yang tidak merusak

Menyortir kolom penyorotan

Opsi sumber data lanjutan

Dukungan plug-in yang ekstensif

Penyortiran, deteksi tipe, fungsi API, pagination, dan pemfilteran

Sepenuhnya dapat diberi tema oleh CSS

Dokumentasi yang solid

110+ contoh yang dibuat sebelumnya

Dukungan penuh untuk Adobe AIR


sumber
5

Lihatlah agiletoolkit.org karena ini memiliki CRUD yang mudah digunakan yang mendukung 2,4,6,7,9,10 dan 12 di luar kotak (menggunakan Ajax untuk mempertahankan grid saat menambahkan, menghapus data dan itu terintegrasi dengan jquery.

Saya akan memposting beberapa contoh tetapi di iPad saat ini.

Trevor North
sumber