JavaScript / JQuery Grid động tốt nhất [đã đóng]

87

Tôi đang làm việc với JavaScript, JQuery và HTML. Giao diện người dùng của dự án của tôi là hoàn toàn động. Tôi đang tìm kiếm JavaScript / JQuery Grid động hỗ trợ các tính năng sau.

Ai có thể cho tôi biết có bất kỳ nguồn mở nào đẹp mắt Grid hỗ trợ các tính năng sau đây không?

  1. Tôi sẽ có thể tạo một phiên bản của lưới tại thời điểm chạy và thêm vào DOM.
  2. Hỗ trợ các mẫu cột (hộp văn bản, hộp chọn, hộp kiểm hoặc bất kỳ đầu vào nào hoặc văn bản đơn giản)
  3. Hỗ trợ đặt mẫu cột mới hoặc thay thế mẫu cột hiện có theo thời gian thực.
  4. Một số điều khiển đầu vào (ví dụ: hộp văn bản, hộp kiểm ..) hiện diện dưới một cột có thể được bật và một số ít có thể bị tắt .
  5. Hỗ trợ setData () tại thời gian thực.
  6. Hỗ trợ sự kiện nếu người dùng thay đổi dữ liệu đầu vào.
  7. Nó sẽ hỗ trợ việc chọn một Hàng
  8. Hỗ trợ thêm hàng hoặc xóa hàng theo thời gian thực mà không cần hiển thị toàn bộ lưới.
  9. Hỗ trợ phân trang.
  10. Hỗ trợ sắp xếp theo bất kỳ cột nào trong thời gian thực.
  11. Kích hoạt một sự kiện nếu dữ liệu được người dùng sắp xếp theo thời gian thực.
  12. Giao diện người dùng lưới phải hỗ trợ các cột có thể thực hiện được
  13. Tự động điều chỉnh lại kích thước (Sẽ rất tuyệt nếu lưới có thể tự động thay đổi kích thước theo kích thước của phần tử mẹ)
  14. Chắc chắn có tài liệu tốt.
javascript  jquery  grid 
— Somnath
nguồn
7
Tự viết. Nếu bạn muốn có tất cả các tính năng đó, bạn cần phải tự làm. Giải pháp tùy chỉnh luôn là giải pháp tốt nhất.
— Raynos
28
Tôi không chắc đó luôn là giải pháp tốt nhất. Ý tôi là - Tôi không về để xây dựng cơ sở dữ liệu của riêng tôi chứ không phải sử dụng InnoDB ...
— Grim ...
2
@Roynos, tôi đã tự viết vài thứ nhưng tôi cần đầu tư nhiều thời gian để triển khai tất cả các tính năng như sắp xếp, thay đổi kích thước ... vv .. vì vậy tôi đang tìm kiếm một điều khiển lưới. Tôi vẫn đang đánh giá từng lưới một.
— Somnath
22
@Raynos Thật là nực cười. Giải pháp tốt nhất là giải pháp hoạt động với chi phí thấp nhất. Tại sao phải xây dựng nó nếu nó đã được hoàn thành?
— richard
@RichardDesLonde bạn nói đúng. Tùy chọn của tôi là chọn giải pháp tốt nhất hiện có và mở rộng nó theo yêu cầu của bạn.
— Somnath

Câu trả lời:

42

Một số hữu ích là:

Miễn phí:

Đã thanh toán:

Các mục tốt nhất theo tôi là Flexigrid và jQuery Grid.

— Soham
nguồn
Cho đến bây giờ tôi bắt đầu thích jQuery Grid. trirand.com/blog/jqgrid/jqgrid.html Nhưng tôi vẫn không chắc. Luôn cập nhật cho bạn ...
— Somnath 30/12/11
@Somnath - Lưới jQuery có phải là lưới mà bạn hài lòng nhất không? Tôi có nhu cầu tương tự và đã đánh giá DataTable, nhưng việc thêm hàng (và đặt chúng là một phần của thứ tự sắp xếp) không hoạt động tốt.
— MattW
@MattW Có, tôi thích jQuery Grid, Thêm dữ liệu thực sự dễ dàng. Ngoài ra, bạn có thể sắp xếp mọi cột chỉ bằng cách đặt cờ. Danh sách yêu cầu của tôi thực sự lớn. Nhưng có vài thứ tôi tự xây dựng và trong một vài trường hợp, tôi đang sử dụng jQuery Grid. Nó cũng có API thú vị và dễ dàng. Tại thời điểm này, tôi hài lòng với jQuery Grid. Tốt của nó.
— Somnath
@Somnath Vì vậy, cuối cùng bạn đã chọn cái nào? Tôi đặt tiêu đề DataTable cũng là một lựa chọn tốt. Cái nào nhanh nhất? Và cái nào hỗ trợ phân nhóm?
— Vivek Vardhan
@VivekVardhan tôi đang sử dụng trirand.com/blog/jqgrid/jqgrid.html
— Somnath
38

bạn có thể thử http://datatables.net/

DataTables là một trình cắm thêm cho thư viện Javascript jQuery. Đây là một công cụ rất linh hoạt, dựa trên nền tảng của cải tiến liên tục, sẽ thêm các điều khiển tương tác nâng cao vào bất kỳ bảng HTML nào. Các tính năng chính:

  • Phân trang độ dài thay đổi
  • Lọc nhanh
  • Sắp xếp nhiều cột với phát hiện kiểu dữ liệu
  • Xử lý thông minh chiều rộng cột
  • Hiển thị dữ liệu từ hầu hết mọi nguồn dữ liệu
  • DOM, mảng Javascript, tệp Ajax và xử lý phía máy chủ (PHP, C #, Perl, Ruby, AIR, Gears, v.v.)
  • Các tùy chọn cuộn cho khung nhìn bảng
  • Hoàn toàn có thể quốc tế hóa
  • Hỗ trợ jQuery UI ThemeRoller
  • Rock solid - được hỗ trợ bởi bộ 2600+ đơn vị thử nghiệm
  • Nhiều plug-in inc. TableTools, FixedColumns, KeyTable và hơn thế nữa
  • Nó miễn phí!
  • Tiết kiệm nhà nước
  • Cột ẩn
  • Tạo bảng động
  • Ajax tự động tải dữ liệu
  • Định vị DOM tùy chỉnh
  • Lọc một cột
  • Các kiểu phân trang thay thế
  • Tương tác DOM không phá hủy
  • Sắp xếp (các) cột đánh dấu
  • Tùy chọn nguồn dữ liệu nâng cao
  • Hỗ trợ plug-in mở rộng
  • Sắp xếp, phát hiện kiểu, hàm API, phân trang và lọc
  • Hoàn toàn có thể tạo chủ đề bằng CSS
  • Tài liệu vững chắc
  • Hơn 110 ví dụ được tạo sẵn
  • Hỗ trợ đầy đủ cho Adobe AIR
— được bao bọc
nguồn
3
Vui lòng định dạng thích hợp cho các tính năng chính. Đừng chỉ sử dụng sao chép / dán. Phải đọc nó một lần sau khi sao chép / dán?
"Tương tác DOM không phá hủy" có nghĩa là gì? Có một thời gian khó khăn để hiểu tại sao điều này là mới lạ hoặc một tính năng và những gì nó bao gồm / đảm bảo.
— John Zabroski
1
@John nó không được đề cập đến trên trang được liên kết nữa, nhưng nếu bạn tìm kiếm trên web cho câu đó, bạn sẽ thấy "Thay đổi lớn nhất trong v1.4 là tương tác DOM không phá hủy. Điều này có nghĩa là DataTables sẽ không ghi đè các phần tử của bảng để thực hiện các chức năng của nó (thực sự nâng cao lũy tiến!), thay vào đó nó di chuyển các phần tử xung quanh. Trong v1.3 và trước khi nó tự động tạo HTML cần thiết cho tbody trên mỗi lần vẽ, điều này không còn xảy ra nữa. Ưu điểm ngay lập tức là tất cả các thuộc tính (các lớp học vv) trên bảng gốc được bảo quản [...]"
— CodeCaster
5
Tôi nghĩ nó không phải là phần mềm miễn phí, mmm, một vấn đề với nó.
— David
4
Có vẻ như những DataTables mát mẻ lưới không thể chỉnh sửa, và nếu bạn cần nó - bạn phải trả tiền cho phiên bản có thể chỉnh sửa: editor.datatables.net/purchase/index
— yetanothercoder
8

Dưới đây là gợi ý của tôi cho JQuery Grid động.

http://reconstrukt.com/ingrid/

https://github.com/mleibman/SlickGrid

http://www.datatables.net/index

Tốt nhất là:

DataTables là một trình cắm thêm cho thư viện Javascript jQuery. Đây là một công cụ rất linh hoạt, dựa trên nền tảng của cải tiến liên tục, sẽ thêm các điều khiển tương tác nâng cao vào bất kỳ bảng HTML nào.

Phân trang độ dài thay đổi

Lọc nhanh

Sắp xếp nhiều cột với phát hiện kiểu dữ liệu

Xử lý thông minh chiều rộng cột

Hiển thị dữ liệu từ hầu hết mọi nguồn dữ liệu

DOM, mảng Javascript, tệp Ajax và xử lý phía máy chủ (PHP, C #, Perl, Ruby, AIR, Gears, v.v.)

Các tùy chọn cuộn cho khung nhìn bảng

Hoàn toàn có thể quốc tế hóa

Hỗ trợ jQuery UI ThemeRoller

Rock solid - được hỗ trợ bởi bộ 2600+ đơn vị thử nghiệm

Nhiều plug-in inc. TableTools, FixedColumns, KeyTable và hơn thế nữa

Tạo bảng động

Ajax tự động tải dữ liệu

Định vị DOM tùy chỉnh

Lọc một cột

Các kiểu phân trang thay thế

Tương tác DOM không phá hủy

Sắp xếp (các) cột đánh dấu

Tùy chọn nguồn dữ liệu nâng cao

Hỗ trợ plug-in mở rộng

Sắp xếp, phát hiện kiểu, hàm API, phân trang và lọc

Hoàn toàn có thể tạo chủ đề bằng CSS

Tài liệu vững chắc

Hơn 110 ví dụ được tạo sẵn

Hỗ trợ đầy đủ cho Adobe AIR

5

Hãy xem agiletoolkit.org vì điều này có CRUD đơn giản để sử dụng hỗ trợ 2,4,6,7,9,10 và 12 ngoài hộp (sử dụng Ajax để bảo vệ lưới khi thêm, xóa dữ liệu và nó tích hợp với jquery.

Tôi sẽ đăng một số ví dụ nhưng trên iPad vào lúc này.

— Trevor North
nguồn
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookie và Chính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.