Table col resizing and col style

[Vadims Talapins]

I have a problem. I want to display the monthly calendar so that it fits without scrolling.
With the help of css, I corrected the size of the column. But at the same time, all elements begin to shift by the end of the month.

But as soon as horizontal scrolling appears, the shifting disappears.

How can I position the element in the center and leave it at the edges along a single 1 pixel, inside the cell? Also, to get everything stuck without scrolling? As in the example in the photo.

What method you can quickly paint over the day using the calendar of holidays. I need only a method. I use an example from documentation that a delay appears in the form of 3 seconds. I need to paint over the creation of cells.

[Nevitha Ravi]

Hi Vadims, 

Greetings from Syncfusion Support. 

To paint over the cells for holidays, you can make use of renderCell event and for the same we have prepared a sample which can be downloaded from the following link. 

http://www.syncfusion.com/downloads/support/forum/144727/ze/Sample1551702627  

onRenderCell:function(args){ 

    if (args.elementType == 'workCells' || args.elementType == "monthCells") { 

      let date = new Date(args.date.getFullYear(), args.date.getMonth(), args.date.getDate()); 

      if ((date.getTime() - new Date(2019, 0, 1).getTime()) == 0) { 

        addClass([args.element], 'paint'); 

      } 

    } 

 } 

td.e-work-cells.e-work-hours.paint,td.e-work-cells.e-alternate-cells.paint,td.e-work-cells.paint { 

    background: #26bb9a30 !important; 

    pointer-events:none; 

} 

The image shared is not available, can you reattach the image? We suspect that your requirement is ‘not want to show horizontal scroll bar’. Can you confirm your view whether you are using timeline month view or vertical month view so that we could provide you the better solution? 

Regards, 

Nevitha 

[Vadims Talapins]

I added a picture with an example, I use "TIMELINE MONTH". Example for my second question works (holidays), Thank you!

Attachment: scheduletask1_edf34a8e.zip

[Karthigeyan Krishnamurthi]

Hi Vadims, 

 

Thanks for the update. 

 

Please use the below code example to achieve your requirement. 

http://www.syncfusion.com/downloads/support/forum/144727/ze/Schedule837034324 

 

.e-schedule .e-timeline-month-view .e-work-cells, 

.e-schedule .e-timeline-month-view .e-date-header-wrap table col, 

.e-schedule .e-timeline-month-view .e-content-wrap table col { 

  width: auto; 

} 

.e-schedule .e-timeline-month-view .e-content-wrap { 

  overflow: inherit; 

  overflow-x: inherit; 

  overflow-y: auto; 

} 

 

 

Regards, 

Karthi 

[Vadims Talapins]

Looked at an example in it, everything works fine. I put css from example, the events started to go in the opposite direction.

Attachment: working_time_bug_b5df434.zip

[Karthigeyan Krishnamurthi]

Hi Vadims,  

 

Thanks for the update. 

 

We have checked our previous sample with event template option and everything is fine. We suspect that your sample side customization could be the cause for the issue.  

http://www.syncfusion.com/downloads/support/forum/144727/ze/Scheduler-180195250 

 

Kindly try to reproduce the error in our sample and revert else share your code example/runnable sample (if possible) to serve you better. 

 

Regards, 

Karthi