Share 7 amazing JavaScript grid plug-ins

Tables have always been the best way to present data. Taking Microsoft Excel as an example, we can sort, sort, edit, or even filter data with just a few clicks. This time, let's take a look at the JavaScript grid plug-in. Using the JS application, it is converted into a common table to a "Excel-like" layout, and has a bunch of functions to load, operate, and view data.

BKJIA recommended topics: Answers to questions about JavaScript learning notes

The seven JavaScript grid plug-ins are listed below. They all have good functions and beautiful UI, which will certainly be very useful.

1. FlexiGrid

Flexigrid is a Grid similar to Ext Gird, but developed based on jQuery. Its functions include adjusting the column width, merging Column Titles, paging, sorting, and displaying/hiding tables. The data displayed by Flexigrid can be obtained through Ajax or converted from a common table.

2. EditableGrid

EditableGrid is a JavaScript Library that enables standard HTML tables to be editable and sorted. This Library allows users to automatically use appropriate editors such as textfields and checkbox to edit cells, and has multiple built-in input validators (integer, double, URL, E-mail, and Date ). In addition, EditableGrid can be integrated with Open Flash Chart to automatically convert data in the table into charts.

3. jQGrid

 

JqGrid is a jQuery plug-in used to display grid data. The document is comprehensive and comes with a Chinese version. It can be integrated with any server-side technology, including PHP, ASP, Java Servlets, JSP, ColdFusion, and Perl.

4. TableSorter

Tablesorter is a jQuery plug-in used to sort table data directly in a browser. It does not need to refresh the page again and supports multiple cell data types, such as values, strings, dates, and custom sorting.

Main features include:

Multi-column sorting

Supports sorting by text, URL address, numeric value, IP address, date type, and custom type

Supports ROWSPAN and COLSPAN attributes of TH elements.

Supports sorting of the second hidden domain

Scalable appearance

Small Program, only 7.4 kb After packaging

5. DataTables

DataTables is a jQuery table plug-in. This is a highly flexible tool based on a step-by-step enhancement that will add advanced interactive control and support for any HTML table. Main features:

Automatic Paging

Real-time table data filtering

Automatic data sorting and data type detection

Automatically process column width

You can customize styles through CSS.

Columns can be hidden.

Easy to use

Scalability and flexibility

Internationalization

Dynamic table Creation

Free

6. SlickGrid

SlickGrid is a simple, fast, and flexible table control. You can hide/display columns, adjust column width, sort columns, customize cell display formats and editors, and edit and create records.

7. Grid from jQuery UI (coming soon)

The jQuery UI Team is developing a grid Widget that can create rich applications and quickly enhance the data link, sorting, layout, filtering, row selection, insertion and editing of HTML tables.

However, it has not been released yet and does not take too long. oschina will track the project. Appendix: jQuery parade