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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Customise delete confirmation view on scheduler

Thread ID:

Created:

Updated:

Platform:

Replies:

144682 May 17,2019 10:27 AM UTC Mar 28,2020 04:42 PM UTC Angular - EJ 2 10
loading
Tags: Schedule
Oliver
Asked On May 17, 2019 10:27 AM UTC

Hello ,
on Essential JS2 for Angular . is there a way to customise delete confirmation view on scheduler?
Ideally we would like to have our own content (form elements, inputs, buttons  etc) on this view.
Also we would like to programmatically close the confirm view , after our custom logic executes


Thanks

Nevitha Ravi [Syncfusion]
Replied On May 20, 2019 10:07 AM UTC

Hi Oliver, 

Greetings from Syncfusion Support. 

We have prepared sample to customize the delete confirmation popup by having an additional dropdown field which can be view from the following link. 

onPopupOpen(args: PopupOpenEventArgs) { 
    if (args.type === 'DeleteAlert') { 
      let content = args.element.querySelector('#QuickDialog_dialog-content'); 
      let dropdown = createElement('div', { className: 'reason-dropdown' }); 
      content.appendChild(dropdown); 
      if (!args.element.querySelector('.reason-dropdown').classList.contains('e-dropdownlist')) { 
        let dropDownListObject: DropDownList = new DropDownList({ 
          width: "100%", 
          placeholder: 'Choose reason', 
          dataSource: ['Duplicate event', 'Unwanted event', 'Others'] 
        }); 
        dropDownListObject.appendTo(dropdown); 
      } else { 
        (args.element.querySelector('.reason-dropdown') as any).ej2_instances[0].value = null; 
      } 
    } 
  } 

To programmatically close the confirmation popup, use the following code. 

document.querySelector('.e-quick-dialog-cancel').click(); 

Regards, 
Nevitha. 


Ivan
Replied On March 20, 2020 08:44 AM UTC

Hello, 

Is there any way to skip your confirmation dialog and have a full customized? 

Eg. on delete not showing dialog and trigger manually action EventRemove and handle confirmation dialog in actionBegin

actionBegin:

if (args.requestType === 'eventRemove' && (args.deletedRecords.length > 0 || !(new ej.base.isNullOrUndefined(args.deletedRecords)))) {
_validateDelete(args, args.deletedRecords[0]);
}

KR,
Ivan

Hareesh Balasubramanian [Syncfusion]
Replied On March 23, 2020 12:08 PM UTC

Hi Ivan, 

Thanks for the update. 

We have validated your reported scenario at our end and for that we have prepared a sample using popupOpen event and the sample can be viewed from the following link, 

Code snippet
  public onPopupOpen(args: any) { 
    if (args.type === 'DeleteAlert') { 
      this.scheduleObj.deleteEvent(args.data); 
      args.cancel = true; 
    } 
  } 


Kindly try the above sample and if you have any other concerns please revert for further assistance. 

Regards, 
Hareesh 


Ivan
Replied On March 23, 2020 08:05 PM UTC

Nice, 

it works.

Thanks!

Vengatesh Maniraj [Syncfusion]
Replied On March 24, 2020 05:20 AM UTC

Hi Ivan, 

Thanks for the update. 

We are happy that our solution has fulfilled your requirement. 

Regards, 
Vengatesh 


Ivan
Replied On March 24, 2020 08:02 PM UTC

One more question.

I have custom structure in database for events ( not ical format for recurring events ) and for delete is important for me to send whole record. 

deleteEvent sends only action remove and key ( id of event ).

when is used deletedRecords field?

KR,
Ivan 

Hareesh Balasubramanian [Syncfusion]
Replied On March 25, 2020 12:46 PM UTC

Hi Ivan, 

Thanks for the update. 

The field deleteRecords is used to carry the event object from client to server while delete the events. And, the deleteEvent object also support to delete the multiple event at single request. Please refer the below sample.  

public onClick() { 
    let records:any = this.scheduleObj.getCurrentViewEvents(); 
    this.scheduleObj.deleteEvent(records); 
  } 


Kindly try the above sample and if you have any other concerns please revert for further assistance. 

Regards, 
Hareesh 


Ivan
Replied On March 26, 2020 09:41 AM UTC

I add two times same record in array, and get on server deletedRecords.

Thanks!

Hareesh Balasubramanian [Syncfusion]
Replied On March 27, 2020 12:40 PM UTC

Hi Ivan, 

Thanks for the update. 

We have tried to understand your requirements at our end. But we couldn't. Kindly let us know more details about your use case scenario/Scheduler rendering code snippets/video demo/workable sample(If possible) for the better serve. 

Regards, 
Hareesh 


Ivan
Replied On March 28, 2020 04:42 PM UTC

Hello. 

first I wanted to bypass your delete dialog. I have achieved the above with your answer regarding the directly call deleteEvent action.

My events are repetitive, but I did not use your implementation for rendering on component, but instead I calculate dates on the server, thus returning data to the Schedule component.

As I returned the event id here in the past, and when I open Editor it got the start date of the day it was selected, it was important for me to get the whole object on the server, not just the remove action and within the key proper id event.

After that you told me, if I have a deletion with the list of objects, the full event objects are sent to the server. So I added the same event 2 x to the list and made the deleted deletedRecords property come to my server. When fetching, I only take the first one because I do not support multiple deletion.

Example:

I have event started on 3rd March and repeats every week until 31 March. 

View period is 23 - 29. march. So Data from server would have one event with date 24. March. But as hidden property it would have 03. March as initial date. 

If I select delete action custom popup will be shown with 3 actions. cancel, delete only this event, delete this and all future event occurrence

if I select to delete only this. result will be two records in database, 03. March. valid to 17.march and second - 31. March
if I select to delete only this and  all future event occurrence. result will be only one record in database, 03. March. valid to 17.march. 


i hope i explained the case well i'm trying to sort it out



CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon