Microsoft Dynamics 365 CRM and Power Apps keep rolling out regular updates to ensure that users get the best value to stay ahead of the competition. Recently, PowerApps Component Framework (PCF) control was redefined so users can easily sort records in the dataset in the PCF control.
PCF custom control is helpful for professional developers and application creators as far as the creation of code components for model-driven and canvas applications is concerned.
Let us find out how to sort records in the dataset in the PowerApps Component Framework (PCF) control using the React Fluent UI framework’s “DetailList-Basic” control.
The dataset object does have the property "sorting" using which users can easily sort records as per a specific column in the ascending or descending order. The ‘onColumnClick’ event has a parameter representing the column that gets clicked. On this event, users can write the undermentioned code:
// when a column header is clicked sort the items
const _onColumnClick = (ev?: React.MouseEvent, column?: any): void => {
let dataset = props.pcfContext.parameters.sampleDataSet;
const newValue: any = {
name: column.fieldName,
sortDirection: column.isSortedDescending ? 0 : 1
}
while (dataset.sorting.length > 0) {
dataset.sorting.pop();
}
dataset.sorting.push(newValue);
(dataset.paging as any).loadExactPage(1);
dataset.refresh();
let isSortedDescending = !column?.isSortedDescending;
setItems(dataset.sorting);
setColumns(
columns.map(col => {
col.isSorted = col.key === column?.key;
col.isSortedDescending = isSortedDescending;
return col;
})
);
}
We first need to choose the present sorting direction of the chosen column in the above code after which changes can be made in the opposite direction. For instance, if the present direction is "descending" then we can change it into "ascending" and vice-versa. For this, we will need to check dataset.sorting.
We will have to pass the object containing the name (the column name) and sortDirection (the current sort direction of the column) to change the current SortStatus of the dataset column.
Once this has been performed, we need to call dataset.refresh() after changing the SortStatus. Furthermore, we will need to navigate to the first page to ensure sorting gets applied to the entire dataset and not only for dataset visible on the same page.
dataset.sorting.push(newValue);
(dataset.paging as any).loadExactPage(1);
dataset.refresh();
We hope this information on how to easily sort records in the PCF control dataset for a particular column in ascending/descending order was useful to you.
If you need any help with Dynamics 365 CRM implementation, please feel free to send an email or call us at C.I.G. Consultants. Our team of certified Dynamics 365 CRM Consultants will be happy to help you.