How can we create a collapsible section Inside a Section
Hi All,
How can we create a collapsible section as shown in attached screens. on click of that expandable Icon, Some of the portion of the existing section should get occupied by this new section which is expanded. And If we collapse it should come to normal like as shown in the pic.
Accepted Solution
Pegasystems Inc.
US
Hi @Raj_Chokka,
After speaking to some of our internal SMEs, the next best course of action is for you to contact Pega Consulting as we don't have anything out of the box for this.
Thank you!
Pegasystems Inc.
US
Hi Raj
Your screen shot indicates that you are seeing this functionality perhaps in decisioning application or another one that involves strategy.
You can see somewhat of similar behavior in the OOTB designer studio. Use chrome developer toolbar and Live UI to figure out how expand/collapse is implemented and you can mimic something similar at your end.
Pegasystems Inc.
IN
Hi Bhuvana,
Thanks for reply. The screenshot you have provided in Designer Studio is Screen Layout with Header Left which is OOTB and the behavior is default. And this behavior will applicable at Portal level and I think we cannot apply this at a section level.
Yes, the screenshot which I'm referencing is a Strategy. There I could see some custom code section in "pzGFWViewerSidePanel" and unable to understand this logic as there is no JS or CSS.
If you understand/know the logic , Can you explain me how can I implement this ?
Pegasystems Inc.
IN
Hello Raju,
I see your requirement is similar to the behavior when LiveUI is enabled and tree is loaded in the section over collapse/expand toggle bar.
Am i correct?
Regards,
Rincy
Pegasystems Inc.
IN
Hello Raju,
There are a couple options that might help at your end:
- Use a screen layout with a resizable panel. This is the best approach in my opinion. Not exactly the style you are looking for but should work OOTB. Did you try this? Or is there any reason for not using a screen layout?
2. You can do something a little more custom with a column layout and a bit of JavaScript to show and hide one of the columns in combination with some custom CSS. I have not tried this approach.
Regards,
Rincy
Pegasystems Inc.
IN
Hi Rincy,
Screen Layout will not suffice my requirement since I want show it at section level and I don't have much knowledge on the JavaScript and CSS to implement the second option and If you have any sample code. Please let me know I will work on it. Thanks!
Pegasystems Inc.
IN
Hello Raju,
We do not have sample code regarding option-2. If you need customization assistance with respect to option-2, kindly reach out to our Pega Consulting, which will be a paid engagement.
Regards,
Rincy
Accepted Solution
Pegasystems Inc.
US
Hi @Raj_Chokka,
After speaking to some of our internal SMEs, the next best course of action is for you to contact Pega Consulting as we don't have anything out of the box for this.
Thank you!