This is a migrated thread and some comments may be shown as answers.

Actions to change View: how to render as dropdown

2 Answers 231 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Hans
Top achievements
Rank 1
Hans asked on 19 Mar 2018, 11:12 AM

Hi,

how can we render the Buttons to select another view (Daily, Weekly, Monthly, etc in the Header-Area of the Scheduler) as dropdown? Is there a template for that purpose so we would be able to render customized markup?

Thanks and regards
Hans

 

2 Answers, 1 is accepted

Sort by
0
Magdalena
Telerik team
answered on 20 Mar 2018, 08:37 AM
Hello Hans,

We have implemented such behavior for screens up to 1024 pixels. If you would like to achieve such appearance for all resolutions, you can apply the following CSS:
.k-scheduler-views .k-current-view {
    display: block;
}
 
.k-scheduler-views > li {
    display: none;
}
 
.k-state-expanded.k-scheduler-views > li {
    display: block;
}
 
.k-scheduler-views {
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: stretch;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    align-items: stretch;
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 1000;
}

I am sending you also this Dojo project with the applied solution.

Regards,
Magdalena
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Hans
Top achievements
Rank 1
answered on 20 Mar 2018, 09:40 AM

Hi Magdalena,

thank you very much :-)

Best Regards
Hans

 

Tags
Scheduler
Asked by
Hans
Top achievements
Rank 1
Answers by
Magdalena
Telerik team
Hans
Top achievements
Rank 1
Share this question
or