Display items from a data source in an interactive, fully customizable table using the Wijmo Grid widget (wijgrid). Interactively select, edit, delete, sort, and group data. Show data across multiple pages making it easy for end-users to page through data.

jQuery Grid sorting

Sorting

The Wijmo Grid offers rich sorting capabilities. Sorting is implemented on the client, but can easily be offloaded to the server too. Our client-side sorting can be used with each column’s dataType to create smart sorting for the type of data used like numbers, strings, and dates. Wijmo Grid also supports complex sorting so that the end-user can sort by multiple columns at once.

jQuery grid paging

Paging

The Wijmo Grid has powerful paging features. Paging is implemented on the client and offers great performance. You also have options to offload paging tasks to the server by passing parameters to a service. The other option is easy to use and the Grid’s paging is meant to be fully extensible. There are also different UI options for paging such as numbered links, arrow buttons, or next/previous buttons.

jQuery grid selection

Selection

With built-in full selection capability, grid users may select a row, cell, or column to trigger an action in the application.

jQuery grid grouping & aggregates

Grouping & aggregates

Configure your grid in outline mode to enable the end-user to collapse and expand the groups by clicking on the group headers. You can also determine whether groups will be initially collapsed or expanded. The grid will display expanded/collapsed icons next to each group header row. Grouped rows can display aggregate data such as counts or sums.

Editable jQuery grid

Editing

Make edits to your data within a cell, and save or cancel changes.

jQuery Grid filtering

Filtering

Wijmo Grid supports a built-in data-entry row below the column headers for custom end-user operations such as searching and filtering records. You can easily filter data by enabling the showFilter option.

Scrolling

Easily enable scrolling. This helps in scenarios where you have hundreds of records, and you may scroll down a few rows and the headers won’t disappear.

jQuery grid column resizing

Column resizing

By setting a single property, Wijmo Grid will automatically size column width and row height when the grid is scrolled to adjust to fit the longest text in a column. You can also enable or disable automatic sizing for specific columns and rows.

jQuery grid column banding

Column banding

Column headers can span over multiple columns enabling you to create a hierarchical structure. For example, organize several column subheadings under another, broader column header.

Column dataTypes

Each column of the Wijmo Grid can be given a strong dataType such as string, number, datetime, currency, or boolean. This feature allows the Grid to provide rich features based on strongly-typed data. The Grid provides custom editors, filters, sorting, and formatting based on the dataType. Wijmo Grid even aligns the content of each cell based on data. For example, all numeric values are right aligned. The dataType feature in Wijmo Grid makes for a superior user experience when working with different data types.

Multiple datasources

The Wijmo Grid supports any DataSource you would want to work with on the client. It can be used in conjunction with our own DataSource widget to automatically wire up sorting, paging, and filtering to a remote or local source. It can also be used with something as simple as an HTML table. Wijmo Grid also supports JavaScript Object and Arrays as well as anything coming from a jQuery AJAX call like JSON or XML. So, no matter what form your data is in, the Wijmo Grid will work with it.

Export

Export your data to Microsoft Excel® or PDF formats using Wijmo Grid. Our Grid supports exporting with just a few lines of code. Our export feature uses a service that must be installable on IIS platforms. Our export service is included in the Wijmo Enterprise package.