1. Home
  2. Forum
  3. ASP.NET MVC - EJ 2
  4. EJ1 Schedule: Appointments not displayed on some screen resolutions

EJ1 Schedule: Appointments not displayed on some screen resolutions

Hi,

We've implemented an EJ1 schedule. Our problem is, for the same schedule, on some screens, the appointments are not displayed and a down arrow appears instead.
We suspect, it depends on the screen resolution and also on the orientation of the schedule (our schedule is oriented horizontally).
For example on a screen with a resolution of 1366x768 the schedule is working fine but not on a 1920x1080 resolution.
Could you help us on this?
(I've attached 2 screenshots to this post.)
Thanks



Attachment: ej1_schedule_KO_e726d0fd.zip

3 Replies
VM Vengatesh Maniraj Syncfusion Team February 17, 2020 05:59 AM UTC

Hi Support Arcania, 

Greetings from Syncfusion Support. 

Thanks for showing interest in Syncfusion Products. We have validated the shared images at our end and we suspect that you have used the Appointment template in your project and done some codes for events rendering position. So this problem has arrived. By default, the event rendering process does not consider the dimensions. So we suggest you set the Schedule’s cell height based on the height of the events.  

Kindly try the above and if you still face the problem please share us your Schedule’s rendering codes to serve you better. 

Regards,
Vengatesh 


SA Support Arcania March 9, 2020 05:34 AM UTC

Hi,

Thanks for your reply.
Yes we've set the schedule's cell height to 75px.
But when an appointment is created, it just takes less than half of the cell's height.
We want the appointment box to have the same height as the cell containing it (for our schedule, a cell can only have one appointment).
We've added a CSS rule

.e-appointment {
    height: 66.9px !important;
}

But that breaks the UI on some resolution as we've told you.

Can you tell us what is the proper way to achieve this?

Thanks

VM Vengatesh Maniraj Syncfusion Team March 10, 2020 06:02 AM UTC

Hi Support Arcania, 
 
Thanks for the update. 
 
We have validated your reported scenario by making below JS sample and it could be working properly in different screen resolutions.  
 
 
Cell height: 69px 
 
 
Appointment height: 67px 
.e-appointment { 
            height: 67px !important; 
        } 
 
 
 
 
Kindly check the above sample and if you still face the issue kindly share the below details which help us to serve you better. 
  1. Reproduce the issue in the above sample
  2. Share your reproduced sample if possible
  3. Share the issue reproduced screen resolutions
 
Regards, 
Vengatesh 


Loader.
Up arrow icon