Let’s add some functionality to our grid, such as sorting and pagination.
To create pagination, we’ll pass our UIKernel.Grid the viewCount property. In this example, we’re going to display 10 records per page.
MainComponent.js:
<UIKernel.Grid
model={this.state.model}
cols={columns}
viewCount={10} // display 10 records per page
/>Next, we’ll pass the sortCycle property to columns. This will allow us to sort our grid data.
columns.js:
const columns = {
name: {
name: 'First Name',
sortCycle: ['asc', 'desc', 'default'], // add sorting
render: ['name', record => record.name]
},
// ...
};Now as you click your grid headers, you’ll see your grid sorted by ascending or descending.