By default, dropdown lookups on a Creatio Freedom UI page sort by alphabetical order. However, it’s possible to change this sort by modifying an attribute for the dropdown lookup that stores the sort config.
To modify this sort, in the page’s model initialization request, you’ll get the current sort config, then modify it to the sort you’d like. The sort config is stored in an attribute that begins with the name of the attribute that the control is bound to, followed by “_List_Sorting”. So, if the attribute that the control is bound to is “PDS_Stage_l08enh0” the sort attribute will be named “PDS_Stage_l08enh0_List_Sorting”. To be clear, this is the name of the attribute the control is bound to, not the name/Id of the control. Also, this method is for dropdown lookups only, not lookups that open the lookup dialog.
In this sample, I have a dropdown for the Opportunity stage. Normally, this will appear sorted alphabetically. I want it to appear in the order of the stages by the stage Number column in ascending order. To make the control sort in this way, I’ll add the following request to the page:
{
request: "crt.HandleViewModelInitRequest",
handler: async (request, next) => {
const sortConfig = await request.$context.PDS_Stage_l08enh0_List_Sorting;
const firstSort = sortConfig[0];
firstSort.columnName = "Number";
firstSort.direction = "asc";
return next?.handle(request);
}
}
In the code above, by dropdown lookup is bound to an attribute named “PDS_Stage_l08enh0”, hence getting the sort config from “PDS_Stage_l08enh0_List_Sorting“. There should already be a sort config at index 0 since it’s the default sort by display value in alphabetical ascending order. The end result will be as follows:
Hi Ryand
One question, I add sorting options in accounts to three lookups (Account Type, Annuel Revenue & Number of employees), but just works Annual Revenue. What could be wrong in my code’
{
request: “crt.HandleViewModelInitRequest”,
// 1.- Typo Empresa
handler: async (request, next) => {
//await next?.handle(request);
let sortingConfigList = await request.$context.Type_List_Sorting;
let firstSortingConfig = sortingConfigList[0];
firstSortingConfig.columnName = “NdosOrdenarPor”; // New field added to sort
firstSortingConfig.direction = “asc”; //desc or asc
return next?.handle(request);
},
// 2.- Nro de Empleados
handler: async (request, next) => {
//await next?.handle(request);
let sortingConfigList = await request.$context.EmployeesNumber_List_Sorting;
let firstSortingConfig = sortingConfigList[0];
firstSortingConfig.columnName = “Position”;
firstSortingConfig.direction = “asc”; //desc or asc
return next?.handle(request);
},
// 3.- Annual revenue/Facturacion anual
handler: async (request, next) => {
//await next?.handle(request);
let sortingConfigList = await request.$context.AnnualRevenue_List_Sorting;
let firstSortingConfig = sortingConfigList[0];
firstSortingConfig.columnName = “FromBaseCurrency”;
firstSortingConfig.direction = “asc”; //desc or asc
return next?.handle(request);
}
}
Hi Julio,
The syntax is incorrect. You have two options:
OPTION 1: Add separate request handlers:
{ request: "crt.HandleViewModelInitRequest", handler: async (request, next) => { // init handler #1 return next?.handle(request); } }, { request: "crt.HandleViewModelInitRequest", handler: async (request, next) => { // init handler #2 return next?.handle(request); } }, { request: "crt.HandleViewModelInitRequest", handler: async (request, next) => { // init handler #3 return next?.handle(request); } }OR
OPTION 2: Add it all to the same init handler (*this is the route I would recommend):
{ request: "crt.HandleViewModelInitRequest", handler: async (request, next) => { // do everything here // add filter for lookup #1 // add filter for lookup #2 // add filter for lookup #3 // etc return next?.handle(request); } }Ryan
Basically, a request handler has two parts:
You can’t have multiple handler function bodies for the same request, unless you separate them all as separate requests with the two parts listed above.
Hi,
How would you make it work for quickfilters, based on number of employees for example ?
Hi Damien,
Whether or not it’s even possible to sort will depend on if it even uses a sort attribute like a normal lookup does. I’ve not tried. To figure out stuff like this, I typically will add a change request handler and output to the console any attribute names that change that contain the name of the quick filter. If that doesn’t reveal anything useful, I’ll write out to the console every attribute name that fired the change handler.
However, it’s possible, and even likely, that the quick filter lookup doesn’t even support adding a sort.
Ryan, Creatio’s Community won’t let me post for some reason… so instead, I stumbled on this article from another customer and you get to be the direct benefactor of my info! 🙂
You can sort any/all Freedom UI lists from the viewModelConfig very easily, no handler needed. Simply find whatever lookup DS you want to sort, create a copy with “_List” appended as a new entry in ViewModelConfig, then set your default sorting. With this approach, you can sort pretty much any/all lists, including quick filters.
The below example is as of version 8.2.1. Not sure whether this works on older versions of Freedom UI, but I would assume anything >8.1.
“PDS_YourLookup”: { // This is the existing lookup dropdown that we want to filter
“modelConfig”: {
“path”: “PDS.YourLookup”
}
},
“PDS_YourLookup_List”: { // Create a new attribute for our _List
“modelConfig”: {
“sortingConfig”: {
“default”: [
{
“columnName”: “Name”, // Replace with the actual object code to sort by
“direction”: “desc” // or “asc” for descending order
}
]
}
}
}