CollectionView for JavaScript

The core data provider for Wijmo

The CollectionView class is the core data provider for all Wijmo controls. It takes a sourceCollection array and provides data views with sorting, filtering, grouping, paging, notifications, change tracking, currency management, and more.

Try the demo

Loading Data

Load data from either the client or the server with CollectionView

Try the demo

Data Views

The CollectionView class represents a view for grouping, sorting, filtering, and navigating data collections.

The object model used in the CollectionView class is similar to the one defined by .NET's ICollectionView and IPagedCollectionView interfaces.

Try the demo

Editing Views

The CollectionView provides support for editing items with methods similar to those found in .NET's IEditableCollectionView interface:

• editItem: Save a copy of the item and put the collection in 'edit mode'. While in edit mode, the view is not refreshed, so items will not be sorted or filtered out of view during the edit process.
• commitEdit: Exit edit mode so sorting and filtering become active again. If the item has changed, the collectionChanged event fires so bound controls can show the changes
• cancelEdit: Restore the original data and exits edit mode.

Try the demo

Performance

The CollectionView class is highly optimized. It sorts, filters, groups, and paginates large data sets efficiently in virtually every situation.

In some cases, you may be able to improve performance even more by using the deferUpdate method to suspend refreshes while performing batch operations.

This is especially important when adding items to collections that are sorted, grouped, or filtered. Without deferred updates, each addition causes a refresh.

Data Providers

The CollectionView class relies on a sourceCollection that contains an array of data items. This collection is typically populated with http requests that retrieve data from a server.

In some cases, it may be advantageous to extend the CollectionView class in order to take advantage of functionality exposed by the server. See Data Extensions for more information.

Try the demo