When All Selected, Text Says All instead of Carousel or List
Up until recently, I've been using Smart Label. Unfortunately, my users experience the bug that causes the export to PDF to mess up. So I read that BloX is supposed to be the way to go. I'm not excellent at HTLM/JSON just yet. Still learning.
I have a filter that allows the user to select one/multiple/All items. This aggregates pivot tables based on what's selected. An example would be countries and the data would be their GDP. In my smart label, if everything is selected, it says "All." I like that. That is what I want. If not All, then it will list what is selected as a list with commas. However, in BloX, it just either does this carousel thing or if you turn the carousel to false, then it just lists everything. I want it to just say "All" if everything is selected. Then have a list separated by a comma if multiple but not all selected.
Example, if all countries selected, it would say "Countries: All".
If USA, Canada, and Mexico are selected, it would say "Countries: USA, Canada, and Mexico"
If only USA is selected, it would say "Countries: USA"
I have a feeling this is pretty simple and I'm just overthinking it. Any help is appreciated!
-
Hi Kate,
Here's something that will, I think, do what you need. Let me know if it works for you! My example uses a filter / field called "Fake Names" instead of "Countries" as in your case.
First, in your BloX widget's Editor tab:
(1) Set "showCarousel" to "true", but add the following option to make the navigation arrows go away:"showCarousel": true,
"carouselAnimation": {
"showButtons": false
},(2) Within the specific Text Block / container you want to change, give it an "id" attribute of "text-to-change" and "wrap" attribute as shown in the bolded section below:"type": "TextBlock",
"text": "{panel:Fake Names}",
"id": "text-to-change",
"wrap": "true",(Explanation: the "id" helps the widget script in the next steps run properly, and the "wrap" helps all the selected options show up if your user selects lots of them).
Next, edit your widget's script by doing this:
(3) Copy and paste the whole script below:widget.on("ready", function(w, args) {
//make sure the target BloX text has an "id" attribute of "text-to-change"
var yourFilterTitle = "Fake Names"; //insert your filter title here
//ASSUMPTION: you're using an ordinary "List"-style filter
var filterDetails = w.dashboard.filters.$$items.find(function(element){
return element.jaql.title === yourFilterTitle;
}).jaql.filter;
if(filterDetails.all === true) {
$("#text-to-change").text(yourFilterTitle + ": All")
} else {
$("#text-to-change").text(yourFilterTitle + ": " + filterDetails.members.join(", "))
}
});(4) Change the variable yourFilterTitle to whatever your dashboard filter's title is instead of "Fake Names" - presumably something like "Country".
(5) Save all the changes, then refresh the dashboard.
I'll show you what my example looks like for "Include All," single-selection, and multiple-selection:
-
The following widget script supports cascaded filters, as well as exclusions.
//======================== Configuration ================================
var yourFilterTitle = "Filter Title Goes Here";
//==========================================================================
widget.on("ready", function(w, args) {
var filterDetails;
//Loop through all filters
prism.activeDashboard.filters.$$items.forEach((itemFilter) => {
//if the filter is cascaded
if(itemFilter.isCascading == true){
//loop through the levels
for(var k=0; k<itemFilter.levels.length;k++){
//If the filter title is equal to FilterName (the target filter)
if(itemFilter.levels[k].title == yourFilterTitle){
filterDetails = itemFilter.levels[k].filter
}
}
}
//If the filter is not cascaded:
else{
//If the filter title is equal to FilterName (the target filter)
if(itemFilter.jaql.title == yourFilterTitle){
filterDetails = itemFilter.jaql.filter
}
}
});
if(filterDetails.all === true) {
$("#text-to-change").text(yourFilterTitle + ": All")
}else if(filterDetails.exclude){
$("#text-to-change").text(yourFilterTitle + ": NOT " + filterDetails.exclude.members.join(", "))
} else {
$("#text-to-change").text(yourFilterTitle + ": " + filterDetails.members.join(", "))
}
});
Please sign in to leave a comment.
Comments
5 comments