Collapse and Expand "container" of variables on Service Catalog Page

Mary Beth Hutch
Tera Guru

I have a requirement to allow the customer to expand or collapse questions on a catalog item. I have set up the containers and they are working correctly in platform, but the collapse/expand buttons do not appear in portal

1 REPLY 1

garimakharb
Mega Guru

Container collapse/expand functionality is NOT supported in Service Portal by default.
 It only works in the Platform view (standard UI16), not in the portal catalog item view.

 

  1. Mark the containers as container_start + container_end and group the variables correctly.

  2. Use a Catalog Client Script (type: onLoad) to inject a toggle button and collapse logic:

 

 
CopyEdit
function onLoad() { var containerId = g_form.getContainerId('container_variable_name'); // replace with your actual container var name var containerEl = document.getElementById(containerId); if (containerEl) { // Create a toggle button var toggleBtn = document.createElement("button"); toggleBtn.innerHTML = "Toggle Section"; toggleBtn.className = "btn btn-primary"; toggleBtn.onclick = function() { var content = containerEl.querySelector('.sc-question-container'); if (content) { content.style.display = (content.style.display === "none") ? "block" : "none"; } }; containerEl.prepend(toggleBtn); } }

 

 
  1. (Optional) Use CSS to style the container or start with it collapsed:

 

 
CopyEdit
/* collapse by default */ #<containerId> .sc-question-container { display: none; }