How to disable or hide the expand/collapse button on resources

I am using Daypilot Scheduler

Sorry but can someone please help me? thank you very much.

Sorry for the delay! You can hide it using custom CSS. For the default theme (scheduler_default) you can use something like this:

.scheduler_default_tree_image_no_children,
.scheduler_default_tree_image_expand,
.scheduler_default_tree_image_collapse {
 display: none !important;
}

Thank you for your answer sir. My next question is how to toggle the hidden on/off base on a boolean. For Example, if I have several managers and each manager has several employee report to him/her. This Collapse/Expand is necessary. If I only have one manager with several employee report to him/her. The Collapse/Expand button is not necessary. If using a css, how do I pass the on/off boolean into it? Thank you very much.

If you want to hide the icons dynamically, you can use jQuery to find the elements and hide them:

$(".scheduler_default_tree_image_no_children, .scheduler_default_tree_image_expand, .scheduler_default_tree_image_collapse").hide();

Update: The jQuery call will only disable icons that are already rendered. When progressive row rendering is enabled (https://doc.daypilot.org/scheduler/progressive-row-rendering/), the additional rows will be rendered during scrolling and they will have the icons visible.

You can either turn off the progressive row rendering (which will perform well only for small number of rows) or you can add the CSS dynamically using DayPilot.sheet() helper (note that it's an internal API which is subject to change):

var sheet = DayPilot.sheet();
sheet.add(".scheduler_default_tree_image_no_children, .scheduler_default_tree_image_expand, .scheduler_default_tree_image_collapse", "display: none");
sheet.commit();

Hi Dan,

I am coding my app with Angular - Ionic. I have try var sheet = DayPilot.sheet(); but property sheet() is not available on my Scheduler. Is there any other method beside jQuery or how do I add sheet() to my DaiPilot Scheduler? Thank you sir very much.

Hi Hoang,

If you want to access members that are not included in the TypeScript definitions you need to cast the object to "any" type like this:

let sheet = (DayPilot as any).sheet();

Thank you sir very much. It is working as toggling off:

sheet.add(".scheduler_default_tree_image_no_children, .scheduler_default_tree_image_expand, .scheduler_default_tree_image_collapse", "display: none");

If I need to toggle it back on, how do I do it sir?

I have tried following but not working:

sheet.remove(".scheduler_default_tree_image_no_children, .scheduler_default_tree_image_expand, .scheduler_default_tree_image_collapse", "display: none");

or

sheet.delete(".scheduler_default_tree_image_no_children, .scheduler_default_tree_image_expand, .scheduler_default_tree_image_collapse", "display: none");

or

sheet.add(".scheduler_default_tree_image_no_children, .scheduler_default_tree_image_expand, .scheduler_default_tree_image_collapse", "display: true");