diff --git a/docs/documentation/docs/controls/ListView.md b/docs/documentation/docs/controls/ListView.md index 664712718..1b529d240 100644 --- a/docs/documentation/docs/controls/ListView.md +++ b/docs/documentation/docs/controls/ListView.md @@ -97,6 +97,7 @@ The ListView control can be configured with the following properties: | dragDropFiles | boolean | no | Specify the drag and drop files area option. Default false. | | onDrop | file | no | Event handler returns files from drag and drop. | | stickyHeader | boolean | no | Specifies if the header of the `ListView`, including search box, is sticky | +| sortItems | (items: any[], columnName: string, descending: boolean) => any[] | no | Custom sorting function to handle sorting by column | The `IViewField` has the following implementation: diff --git a/src/controls/listView/IListView.ts b/src/controls/listView/IListView.ts index 4ba0931ab..289fc58f9 100644 --- a/src/controls/listView/IListView.ts +++ b/src/controls/listView/IListView.ts @@ -68,6 +68,11 @@ export interface IListViewProps { * Set to false by default */ stickyHeader?: boolean; + /** + * Custom sorting function. + * @returns sorted collection of items + */ + sortItems?: (items: any[], columnName: string, descending: boolean) => any[]; } export interface IListViewState { @@ -86,7 +91,7 @@ export interface IListViewState { columns?: IColumn[]; groups?: IGroup[]; - + } export interface IGrouping { diff --git a/src/controls/listView/ListView.tsx b/src/controls/listView/ListView.tsx index 07e695086..025e3f5fd 100644 --- a/src/controls/listView/ListView.tsx +++ b/src/controls/listView/ListView.tsx @@ -460,6 +460,9 @@ export class ListView extends React.Component { * @param descending */ private _sortItems(items: any[], columnName: string, descending = false): any[] { + if (this.props.sortItems) { + return this.props.sortItems(items, columnName, descending); + } // Sort the items const ascItems = sortBy(items, [columnName]); const sortedItems = descending ? ascItems.reverse() : ascItems;