Collapsible group, only one open by default

[NikkiC]

Hi there,

I have a tabular report datapage which uses a collapsible group.  It seems you can either have all expanded by default or all collapsed by default and nothing in between.

Is there a workaround to this, so that I can choose to only have one of my 3 groups open and the other 2 closed?

Many thanks

Nikki

 

[douvega]

Hi NikkiC,

You can have your first group expanded by choosing "Enable data grouping by this field" > Collapsible Group (from Grouping display dropdown) > Expanded by Default

Your second and third groups should be "Enable data grouping by this field" > Collapsible Group (from Grouping display dropdown) > Collapsed by Default

Hope it helps.

[NikkiC]

16 hours ago, douvega said:

Hi NikkiC,

You can have your first group expanded by choosing "Enable data grouping by this field" > Collapsible Group (from Grouping display dropdown) > Expanded by Default

Your second and third groups should be "Enable data grouping by this field" > Collapsible Group (from Grouping display dropdown) > Collapsed by Default

Hope it helps.

Hi there, 

Thanks for this, I didn't explain properly ... these aren't separate groups, it's one field, grouped by what's in the field!  So my field is "status" and it is grouped by one of 3 items in this field: open, pending, archive.  I would like "open" to be expanded, but pending and archive to be collapsed.

Many thanks!

Nikki

[NikkiC]

Hi there,

Just re-opened this with Caspio support and thought I'd see if anyone here has any ideas yet?  This is a real pain, since the groups themselves don't have a Unique ID I can call (they're all called "Group 1")

Any help would be much appreciated!

Nikki

[MayMusic]

Each category value needs to be a plain text for instance:

var category1 = document.querySelectorAll("[class^=cbResultSetGroup1Label]")[0].innerText.replace(/\s/g, "");
var category2 = document.querySelectorAll("[class^=cbResultSetGroup1Label]")[1].innerText.replace(/\s/g, "");
var category3 = document.querySelectorAll("[class^=cbResultSetGroup1Label]")[2].innerText.replace(/\s/g, "");

Then let's say if you want the top1 group value to be expanded by default:

if(category1 == "Top1"){
document.getElementsByTagName("span")[1].setAttribute("data-cb-collapsed", "true");
document.querySelectorAll("[id^='DataRow'][class^='cbResultSetDataRow']")[0].setAttribute("style", "display: true");
} else if(category2 == "Top1"){
document.getElementsByTagName("span")[2].setAttribute("data-cb-collapsed", "true");
document.querySelectorAll("[id^='DataRow'][class^='cbResultSetDataRow']")[1].setAttribute("style", "display: true");
} else if(category3 == "Top1"){
document.getElementsByTagName("span")[3].setAttribute("data-cb-collapsed", "true");
document.querySelectorAll("[id^='DataRow'][class^='cbResultSetDataRow']")[2].setAttribute("style", "display: true");
 
}

 

[MayMusic]

No this code seems to be very specific to one report page and the number of rows fall under each category. This does not seem to be an easy code at all

[NikkiC]

12 hours ago, MayMusic said:

No this code seems to be very specific to one report page and the number of rows fall under each category. This does not seem to be an easy code at all

Thanks so much for looking at this, @MayMusic, really appreciate it!  Yes, it's definitely a head scratcher, but it seems like it should be such a simple thing, my clients are like "why haven't you done this yet"?!!