Forum Discussion
Hello Carter,
You can add this second Tabber to the IDs of widgets you are showing and hiding in the first Tabber. Just copy it's ID, add it for the widgets to be shown for CASELOAD, and add it to be hidden for every other case. And the second one just set up as you wish, and then it should work as you described it above!
Please let me know if that works for you,
If not - I can prepare a little instruction for you to show this functionality.
Best Regards,
Patryk QbeeQ
Thank you for your feedback, Patrykked!
Here is the code for my parent tabber:
widget.on('render',function(w, e) {
e.prefixText = '';
e.suffixText = '';
e.selectedColor = '#A90A40'; /*The color of the chosen title*/
e.fontColor = '#cccccc'; /*The color of the unchosen titles*/
e.elementWidth = '103%';
e.descColor = '#a5a5a5';
e.parentMarginLeft = '-15px';
e.height = 32; /* affects the tabber widget default high*/
});
widget.tabs = [{title: "FINANCIAL", displayWidgetIds : ["6231ebbcbe4b2e2fc893aac4","6231ebbcbe4b2e2fc893aac8","6231ebbcbe4b2e2fc893aac9","6234d947be4b2e2fc893b35c","6242fafc20c4e50f94925a0f"],
hideWidgetIds : ["62448914d80c3a3f50af2ced","6231ebbcbe4b2e2fc893aac6","6231ebbcbe4b2e2fc893aac7","6231ebbcbe4b2e2fc893aac3","6231ebbcbe4b2e2fc893aac5","6231ebbcbe4b2e2fc893aaca","6231ebbcbe4b2e2fc893aacb",
"6231ebbcbe4b2e2fc893aad0","6231ebbcbe4b2e2fc893aacc","6231ebbcbe4b2e2fc893aace", "6231ebbcbe4b2e2fc893aacd","6231ebbcbe4b2e2fc893aacf","6244228220c4e50f949261fc","62446773d80c3a3f50af2884","624465b2d80c3a3f50af2752","624483d4d80c3a3f50af2b77"
]},
{title: "DELIVERY METRICS",
displayWidgetIds : ["6231ebbcbe4b2e2fc893aac6","6231ebbcbe4b2e2fc893aac7"],
hideWidgetIds : ["62448914d80c3a3f50af2ced","6231ebbcbe4b2e2fc893aac3","6231ebbcbe4b2e2fc893aac5","6231ebbcbe4b2e2fc893aaca","6231ebbcbe4b2e2fc893aacb",
"6231ebbcbe4b2e2fc893aad0","6231ebbcbe4b2e2fc893aacc","6231ebbcbe4b2e2fc893aace", "6231ebbcbe4b2e2fc893aacd","6231ebbcbe4b2e2fc893aacf","6231ebbcbe4b2e2fc893aac4","6231ebbcbe4b2e2fc893aac8","6231ebbcbe4b2e2fc893aac9","6234d947be4b2e2fc893b35c","6242fafc20c4e50f94925a0f","6244228220c4e50f949261fc","6231ebbcbe4b2e2fc893aac5"
,"62446773d80c3a3f50af2884","624465b2d80c3a3f50af2752","624483d4d80c3a3f50af2b77"]},
{title: "CASELOAD",
displayWidgetIds : ["62448914d80c3a3f50af2ced","6244228220c4e50f949261fc","6231ebbcbe4b2e2fc893aac5","624465b2d80c3a3f50af2752","624483d4d80c3a3f50af2b77"],
hideWidgetIds : ["6231ebbcbe4b2e2fc893aaca","6231ebbcbe4b2e2fc893aacb","6231ebbcbe4b2e2fc893aad0","6231ebbcbe4b2e2fc893aace","6231ebbcbe4b2e2fc893aac6","6231ebbcbe4b2e2fc893aacd","6231ebbcbe4b2e2fc893aac7","6231ebbcbe4b2e2fc893aac4","6231ebbcbe4b2e2fc893aac8","6231ebbcbe4b2e2fc893aac9","6234d947be4b2e2fc893b35c","6242fafc20c4e50f94925a0f","6231ebbcbe4b2e2fc893aac3","6231ebbcbe4b2e2fc893aacc"]},
{title: "PDPM DISTRIBUTION",
displayWidgetIds : ["6231ebbcbe4b2e2fc893aaca","6231ebbcbe4b2e2fc893aad0", "6231ebbcbe4b2e2fc893aacf"],
hideWidgetIds : ["62448914d80c3a3f50af2ced","624483d4d80c3a3f50af2b77","6231ebbcbe4b2e2fc893aac6","6231ebbcbe4b2e2fc893aac7", "6231ebbcbe4b2e2fc893aac4","6231ebbcbe4b2e2fc893aac8","6231ebbcbe4b2e2fc893aac9","6234d947be4b2e2fc893b35c","6242fafc20c4e50f94925a0f","6231ebbcbe4b2e2fc893aacb","6244228220c4e50f949261fc","6231ebbcbe4b2e2fc893aac5",
"62446773d80c3a3f50af2884","624465b2d80c3a3f50af2752","6231ebbcbe4b2e2fc893aac3","6231ebbcbe4b2e2fc893aacd","6231ebbcbe4b2e2fc893aace"]},
{title: "OTHER",
displayWidgetIds : ["6231ebbcbe4b2e2fc893aacc","6231ebbcbe4b2e2fc893aacb","6231ebbcbe4b2e2fc893aac3","6231ebbcbe4b2e2fc893aace","6231ebbcbe4b2e2fc893aacd"],
hideWidgetIds : ["62448914d80c3a3f50af2ced","6231ebbcbe4b2e2fc893aaca","624483d4d80c3a3f50af2b77"]},
];
widget.style.activeTab = widget.tabs.findIndex(el=>el.title == "FINANCIAL")
Here is the code for my child tabber:
widget.tabs = [
{title: "PDPM",
displayWidgetIds : ["6244228220c4e50f949261fc","6231ebbcbe4b2e2fc893aac5",],
hideWidgetIds : ["6231ebbcbe4b2e2fc893aace","6231ebbcbe4b2e2fc893aac6","6231ebbcbe4b2e2fc893aacd","624465b2d80c3a3f50af2752","6231ebbcbe4b2e2fc893aac7","6231ebbcbe4b2e2fc893aac4","6231ebbcbe4b2e2fc893aac8","6231ebbcbe4b2e2fc893aac9","6234d947be4b2e2fc893b35c","6242fafc20c4e50f94925a0f","6231ebbcbe4b2e2fc893aac3","6231ebbcbe4b2e2fc893aacc"]},
{title: "LEVEL HMO",
displayWidgetIds : ["6231ebbcbe4b2e2fc893aac5","624465b2d80c3a3f50af2752"],
hideWidgetIds : ["6244228220c4e50f949261fc","6231ebbcbe4b2e2fc893aace","6231ebbcbe4b2e2fc893aac6","6231ebbcbe4b2e2fc893aacd","6231ebbcbe4b2e2fc893aac7","6231ebbcbe4b2e2fc893aac4","6231ebbcbe4b2e2fc893aac8","6231ebbcbe4b2e2fc893aac9","6234d947be4b2e2fc893b35c","6242fafc20c4e50f94925a0f","6231ebbcbe4b2e2fc893aac3","6231ebbcbe4b2e2fc893aacc"]},
];
widget.style.activeTab = widget.tabs.findIndex(el=>el.title == "")
When the dashboard loads, it defaults to the FINANCIAL tab due to the last line in the Parent code. Although the child tabber successfully appears when the CASELOAD tab is activated, it does not default to the PDPM selection as desired.
When I update the last line of code in the child tabber to activate the PDPM tab on load, it loads the PDPM widgets on all 5 parent tabs.
widget.style.activeTab = widget.tabs.findIndex(el=>el.title == "PDPM")
Does that make sense? Let me know if I can provide you with any additional clarification!
Thanks so much,
Carter
- sathishkumar_a10-11-2022Data Storage
Hi,
Were you able to achieve this ? If so could you please share how you did it