Block schedule time

Can i block the past schedule time or block some schedule's time for anyone click on?

5 Replies

KK Karthigeyan Krishnamurthi Syncfusion Team April 1, 2019 09:17 AM UTC

Dear Customer, 
 
Greeting from Syncfusion. 
 
We have prepared the below sample to prevent the CRUD actions in the past time cells. 

eventRendered: function (args) { 
    if (new Date() - new Date(args.data.StartTime) > 0) { 
      args.data.IsReadonly = true 
      args.element.setAttribute('aria-readonly', 'true'); 
      args.element.classList.add('e-read-only'); 
    } 
  }, 
  dragStop: function (args) { 
    if (new Date() - new Date(args.data.StartTime) > 0) { 
      args.cancel = true; 
    } 
  }, 
  resizeStop: function (args) { 
    if (new Date() - new Date(args.data.StartTime) > 0) { 
      args.cancel = true; 
    } 
  }, 
  popupOpen: function (args) { 
    if (new Date() - new Date(args.data.startTime) > 0) { 
      args.cancel = true; 
    } 
  }, 
  actionBegin: function (args) { 
    if (args.requestType == 'eventCreate' || args.requestType == 'eventDelete' || args.requestType == 'eventChange') { 
      let data = (args.requestType == 'eventCreate') ? args.data[0] : args.data; 
      if (new Date() - new Date(data.StartTime) > 0) { 
        args.cancel = true; 
      } 
    } 
  } 
 
 
Regards, 
Karthi 
 



S_ S_Line April 1, 2019 11:46 AM UTC

Thank's for the answer, but, i need to block only the past time, and not the past event. Can i write some text to inform that "this time is blocked"?



KK Karthigeyan Krishnamurthi Syncfusion Team April 2, 2019 11:28 AM UTC

Dear Customer,   
 
Thanks for your update. 
 
We modified our previous sample to make only the past time cells as read-only and also displayed custom text with custom color using renderCell and cellTemplate options. 

cellTemplate: '<div class="templatewrap">${getCellContent(data.date)}</div>', 
 
renderCell: function(args) { 
        if (args.element.classList.contains('e-work-hours') || args.element.classList.contains('e-work-cells')) { 
          if (args.date.getTime() < new Date().getTime()) { 
            args.element.classList.add('custom'); 
          } 
        } 
    } 
 
.custom { 
              background-color: #babebd !important; 
            } 
 
.e-schedule .e-vertical-view .e-all-day-cells .templatewrap { 
              display: none !important; 
            } 
 
 
Regards, 
Karthi 



S_ S_Line April 2, 2019 02:04 PM UTC

Ok, thank you! Helped me!!


NR Nevitha Ravi Syncfusion Team April 3, 2019 08:23 AM UTC

Dear Customer, 
  
We are glad that our solution meets your requirement and please let us know if you need any further assistance. 
  
Regards, 
Nevitha. 


Loader.
Up arrow icon