Unplanned
Last Updated: 30 Jul 2020 17:05 by ADMIN
Neil
Created on: 07 Jan 2020 08:22
Category: Scheduler
Type: Feature Request
3
hide/remove the 'All Day slot'

I want to hide the 'All Day slot'  - I don't want to offer this functionality.

At the moment, you could try CSS like this, but ideally this would be a parameter (maybe on the view):

 

        .no-allday .k-scheduler-head .k-scheduler-group:last-child{
            display:none;
        }

    <div class="no-allday">
        <TelerikScheduler Data="@Appointments" @bind-Date="@StartDate" @bind-View="@CurrView" Height="600px" Width="800px">
            <SchedulerViews>
                <SchedulerDayView StartTime="@DayStart" />
                <SchedulerWeekView StartTime="@DayStart" />
                <SchedulerMultiDayView StartTime="@DayStart" NumberOfDays="10" />
            </SchedulerViews>
        </TelerikScheduler>
    </div>

3 comments
ADMIN
Marin Bratanov
Posted on: 30 Jul 2020 17:05

A comment on the workaround made by Roland here may be interesting for Week View, I am pasting it here for convenienice:

using display:none causes all appointments in a Week view to be displayed in the first column.
using height:0; overflow:hidden; seems to work as expected.

 

Regards,
Marin Bratanov
Progress Telerik

Andrew
Posted on: 08 Jul 2020 13:40

Thanks for the workaround for the UI side, Neil.

I agree there should be a way to disable this entirely. The Scheduler appears to require the bound TItem to have something for IsAllDayField to bind to. Obviously, if we don't want to use IsAllDay, this binding is useless. Disabling this at the component level would be a much better solution than hacky workarounds.

Neil
Posted on: 07 Jan 2020 10:24

There is a unique identifier for the All day button '.k-scheduler-times-all-day'

approach causes multiple events occurring on the same day to stack on top of each other, so a better solution is to hide the '.k-scheduler-times-all-day'  and set the 'k-scheduler-group:last-child' to 0px height (preserving the width, stops multiple events stacking)

 
 
so CSS would be:

    .no-allday .k-scheduler-head .k-scheduler-group:last-child {
        height: 0px;
    }

    .no-allday .k-scheduler-times-all-day {
        display: none;
    }