Need to change the filter colors when something is selected

[amritbhgt]

Hi All,

I have several filters in my dashboard, i want to change the colors when something is selected in the filters to distinguish between selected and unselected filters . 

currently i am using 

$('.uc-tag').css('background-color','#006ecf');
$('.uc-tag').css('color','white');

as filter colors and background

[Benji_PaldiTeam · Accepted solution]

Hi @amritbhgt ,

Here are some options to achieve this:

1. Use below dashboard script to change the color of selected/unselected filters

dashboard.on('refreshstart', function(dashboard, args){
	
	//color of selected filters
	$('.uc-tag').css('background-color','#0f8037');
	$('.uc-tag').css('color','white');
	
	//color of Include all
	$('.uc-tag[title="Include all"]').css('background-color','#006ecf');
	$('.uc-tag[title="Include all"]').css('color','white');

	//color of unselected filters
	$('.uc-tagline-content.exclude .uc-tag').css('background-color','#ab204f');
	$('.uc-tagline-content.exclude .uc-tag').css('color','white');

}) 

2. Use Paldi premium Control Filter Colors plugin which will allow you to configure the colors and you don't need to apply any script in each dashboard.

Feel free to reach out if you have further questions, we're always happy to help 🙂
[email protected] 
Paldi Solutions, Number #1 Sisense Plugins Developer

[marcoperson250]

Hello there,

Write the Javascript to detect the filter event, then modify it dynamically for a friendly experience, apply transition effects to the color change, and then test the script. https://community.sisense.com/t5/build-analytics/need-to-change-the-filter-colors-when-something-is-...python training in noida

I hope this is helpful for you.

[amritbhgt]

This links redirects me to this page only, can you provide the code and updated link

[Benji_PaldiTeam · Accepted solution]

Hi @amritbhgt ,

Here are some options to achieve this:

1. Use below dashboard script to change the color of selected/unselected filters

dashboard.on('refreshstart', function(dashboard, args){
	
	//color of selected filters
	$('.uc-tag').css('background-color','#0f8037');
	$('.uc-tag').css('color','white');
	
	//color of Include all
	$('.uc-tag[title="Include all"]').css('background-color','#006ecf');
	$('.uc-tag[title="Include all"]').css('color','white');

	//color of unselected filters
	$('.uc-tagline-content.exclude .uc-tag').css('background-color','#ab204f');
	$('.uc-tagline-content.exclude .uc-tag').css('color','white');

}) 

2. Use Paldi premium Control Filter Colors plugin which will allow you to configure the colors and you don't need to apply any script in each dashboard.

Feel free to reach out if you have further questions, we're always happy to help 🙂
[email protected] 
Paldi Solutions, Number #1 Sisense Plugins Developer

[amritbhgt]

It changes the color for a second but once the view is loaded it again goes back to blue color(Include all Color)

[Benji_PaldiTeam · Accepted solution]

Hi @amritbhgt ,

Make sure sure there is no other script in the dashboard/widgets to change the color of filters.

$('.uc-tag').css('background-color','#006ecf');
$('.uc-tag').css('color','white');

Also make sure there is no other plugin that changes the color of filters.

It would be good to try the script on  a new dashboard to verify it.

Feel free to reach out if you have further questions, we're always happy to help

[email protected] 
Paldi Solutions, Number #1 Sisense Plugins Developer

[DRay]

Hello @amritbhgt,

Did the solution offered by @Benji_PaldiTeam work for you? If so, please click the 'Accept as Solution' button so that other members can easily find the answer. If not, please let us know so that we can continue to help you.

Thank you, and have a great day!

[DRay]

Hello @amritbhgt,

Did the solution offered by @Benji_PaldiTeam work for you? If so, please click the 'Accept as Solution' button so that other members can easily find the answer. If not, please let us know so that we can continue to help you