Multiple views with same Option but different intervals

[Corina Ivanov]

Hi,

I have encountered the following scenario: I need to have a Day view and a 3Days view and I could not find a way to do so using the views of the scheduler,

I have tried 2 possible solutions: 

• Defining 2 views with Option Day with different display names, name property and interval.
• Defining one single view with Option Day and binding the displayName and interval to custom properties from my implementation

However, none if this seems to work well as the scheduler is not refreshed when the interval changes or when I set the currentView to the displayName of 3 Days.

Could you guide me in the right direction to achieve this?

Thank you,

Corina

[Karthigeyan Krishnamurthi]

Hi Corina, 

 

Syncfusion greetings. 

 

We can achieve your requirement using option and interval options like below. 

https://stackblitz.com/edit/angular-vnzlem?file=app.component.html 

https://ej2.syncfusion.com/angular/documentation/schedule/views/?no-cache=1#extending-view-intervals 

https://www.syncfusion.com/kb/10500/how-to-find-the-current-view-when-the-scheduler-is-rendered-with-same-views-with-different 

 

<e-views> 

      <e-view displayName='Day' option='Day'></e-view> 

      <e-view displayName='3 Days' option='Day' [interval]="dayInterval"></e-view> 

    </e-views> 

 

Regards, 

Karthi 

 

[Corina Ivanov]

Hi Karthi,

Thank you for your reply.

However, this does not work as expected.

My situation is as follows: I have disabled the scheduler header as I have to handle the view type change in custom header.

In this case I am trying to set the currentView to a value that differentiates between Day and 3Days.

I first tried to use the binding for currentView but this does not work as it accepts only 'Day', 'Week', etc but nothing custom for ThreeDays.

Then I tried using the following method, by passing 0 or 1 as index but no luck either. When I set viewIndex 1 it returns with viewIndex 0 after render and nothing changes. 

this.scheduler.changeView('Day', null, null, 0);

this.scheduler.changeView('Day', null, null, 1);

I have also looked in SF code and it looks that Schedule.setViewOptions resets the viewIndex.

My views are defined as follows:

<e-views>

<e-view option="Day" displayName="Day" [group]="grouping">

</e-view>

<e-view option="Day" displayName="ThreeDays" interval="3">

</e-view>

<e-view option="Week" displayName="Week"></e-view>

<e-view option="Agenda" displayName="Agenda" [allowVirtualScrolling]="true"></e-view>

</e-views>

Please let me know if you have any ideas how I could proceed further.

I am currently evaluation the Scheduler by comparison with other solutions on the market and by EOW we need to take a decision.

Thanks,

Corina

[Corina Ivanov]

I found a solution for this.

When changing the view I have to set the param 'muteOnChange true.

[Karthigeyan Krishnamurthi]

Hi Corina, 

 

We're glad to hear you've solved the problem. For further help, please let us know. 

 

Regards, 

Karthi