We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
  1. Home
  2. Forum
  3. Angular
  4. how to highlight the cell from date range?

how to highlight the cell from date range?

Hi, 

First of all thank you very much for helping developer with such a great products.

I am working with Angular 8 Application where I have used the scheduler.

I would like to discuss some requirements.

1. I would like to highlight the cell in schedule on external click event.

     i.e On click event (Not from the scheduler)  I am getting date range.  i have date range 10.01.2020 - 15.01.2020. I would like to just highlight this date range with back ground color. Is it possible?    




Regards,
Parth

7 Replies
HB Hareesh Balasubramanian Syncfusion Team January 20, 2020 12:19 PM UTC

Hi Parthkumar, 
 
Greetings from Syncfusion Support. 
 
Based on your requirement, we have prepared a sample such that the scheduler cells has been highlighted while click on the button externally and the same can be viewed from the following link, 
 
Kindly try the above sample, if you have any concerns please revert us back for further assistance. 
 
Regards, 
Hareesh 


PK Parthkumar Kakadiya January 20, 2020 02:35 PM UTC

Hi Hareesh,

Thanks a lot for your support.

Your solution worked perfect what i want. Thanks for your help..


Have a nice day.

Regards,
Parth

VM Vengatesh Maniraj Syncfusion Team January 21, 2020 05:19 AM UTC

Hi Parth, 

You are most welcome. 

Regards, 
Vengatesh 


PK Parthkumar Kakadiya January 27, 2020 04:28 PM UTC

Hi ,

Small update for this thread. 

Once I highlighted the cell:

  How could I refresh the cell again to normal style?

Regards,
parth

VM Vengatesh Maniraj Syncfusion Team January 28, 2020 07:36 AM UTC

Hi Parth, 
 
Thanks for the update. 
 
Based on your requirement, we have prepared the below sample to remove the highlighted cells. 
 

Kindly try the above sample and revert us for further assistance. 
 
Regards, 
Vengatesh 



PK Parthkumar Kakadiya January 28, 2020 10:15 AM UTC

Hi Vengatesh,

Thanks a lot for your solution. It works fine for me. 

I have few queries regarding the Date Format.

1. How could i highlight the cell with the only One Date? i.e. "2020-01-02"

2. In the date range I have Date in the string Format and I am using below code to highlight cell.


This is the date I am giving : 

Result looks something Like: 

As you can see, For the starting date which start From "2019-11-06" But It start Highlight from the 10th. As far as I understood I think it's problem of date Format not sure.


3. I have made my Own Custom Editor Window which is open on One Click at Cell. Now I am getting start and End date like below.


As you can see it shows next day date for Enddate.  in below picture you can also see the code:



I have changed the name of the start and end time for data binding with my data structure.

Please help me with this small stuff. I have also attached my code.
Thanks a lot for your support.

Regards,
Parth

Attachment: calendar_6a941b3.zip

VM Vengatesh Maniraj Syncfusion Team January 29, 2020 09:35 AM UTC

Hi Parth, 

Tanks for the update. 

We have validated the shared details and we suspect that you have used the custom date format and it would be the cause. So we suggest that you have to use the format property for dateTimePicker component. Please refer to the below links for more reference. 


Kindly set the format for dateTimePicker control and see the result. If still the issue persists please let us know.  

Regards, 
Vengatesh 


Loader.
Up arrow icon