Sort BloX Widget Carousel by Value

[jwoodard]

I am looking to find a way to use a widget script to override the sort logic for a BloX Carousel. 

Use Case: I am displaying the Top 10 agents for a company and wish to sort by the production rank of the individuals as opposed to the alphabetical order of the agent's name. This would allow the user to always see the top ranked agent first and would progress to the 2nd ranked, 3rd ranked and so on. 

Other details: There is no need to update the sort order or switch the direction of the sort as the ranking would drive the experience so this solution could be hard-coded in the widget script. 

[harikm007]

Hi @jwoodard ,

If there is only one dimension added under 'Items' panel (as Region in below screenshot), try this script:

var categories= ['South','West','Midwest','Unknown','Northeast'];


widget.on('queryend',function(se,ev){
	ev.rawResult.values.sort(function(a, b){
		var aIndex = categories.indexOf(a[0].data);
		var bIndex = categories.indexOf(b[0].data);
						
		if (aIndex < bIndex)
			return -1;
		if (aIndex > bIndex)
			return 1;
							
		return 0;
	})
})

Related posts: 

https://www.binextlevel.com/post/sort-bar-columns-breakby-manually

https://www.binextlevel.com/post/sort-bar-column-line-chart-based-on-a-field-in-table

-Hari

[jwoodard]

Greetings Hari, 

Unfortunately, this solution does not solve for my specific use case. Providing a few more details and examples to hopefully help better explain from my end. 

I am using a BloX widget and have the carousel enabled "showCarousel": true  with two items (officeId & officeName). 

By default, the BloX widget sorts based on the items in alphabetical order. For example, the first result the carousel returns is "A Sample Office Name" though this office is ranked #8 in the top ten agencies. 

In order to see the #1 ranked item, the user must click through the results until they find the #1 ranked office. The rank data is coming from the values section shown in the first image. As the sorting of the carousel is based on the office information instead of the rank, the ranks are shuffled as the user clicks through the carousel. 

Our goal is to have the #1 ranked item (based on the values) first appear when the widget is loaded. The 2nd item should be the first item when the right carousel arrow is clicked, followed by the 3rd, and so on. The 10th ranked item should show when clicking the left carousel arrow when viewing the top ranked item. 

Hopefully this provides more clarity! 

Thanks, 

Jordan

[harikm007 · Accepted solution]

Hope this script works. This is to sort blox by Values.  (here 2 is the index of Rank panel in your screenshot)

widget.on('queryend',function(se,ev){
	ev.rawResult.values.sort(function(a, b){
		var aValue = a[2].data;
		var bValue = b[2].data;
						
		if (aValue < bValue)
			return -1;
		if (aValue > bValue)
			return 1;
							
		return 0;
	})
})

Just curious to know - Does the value panel's sorting not work?

-Hari

[jwoodard]

Thanks Hari! 

Looks like I overcomplicated things and missed the easiest solution. The script will be useful in some other applications I'm working on implementing with BloX though so it is helpful to understand the calls provided.