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

Canceling actionBegin with aync paramater

I'm currently working on a project using the schedule component, and I can't seem to work out why the "actionBegin" function built into the component doesn't work properly when dealing with an async callback and also why events are added if "args.cancel" is triggered by an await parameter

This is the issue:

actionBegin={ async (args: ActionEventArgs) => { const { requestType, changedRecords, addedRecords, deletedRecords } = args let performAction: any = false let isOnLine = navigator.onLine if (requestType === "eventCreate") { if (addedRecords?.length) performAction = await addSchedule(addedRecords) } else if (requestType === "eventChange") { if (addedRecords?.length) performAction = await addSchedule(addedRecords) if (changedRecords?.length) performAction = await changeSchedule(changedRecords) if (deletedRecords?.length) performAction = await popSchedule(deletedRecords) } else if (requestType === "eventRemove") { if (deletedRecords?.length) performAction = await popSchedule(deletedRecords) } console.log(performAction === false && (requestType === "eventChange" || requestType === "eventRemove" || requestType === "eventCreate") && isOnLine === false) console.log(`isOnLine-${isOnLine}`) console.log(`performAction-${performAction}`) if (performAction === false && (requestType === "eventChange" || requestType === "eventRemove" || requestType === "eventCreate") && isOnLine === false) args.cancel = true } }

1 Reply

RV Ravikumar Venkatesan Syncfusion Team December 27, 2022 04:12 PM UTC

Hi CodeAlgo,

We suspect that the added, updated, or deleted data was updated with the Schedule dataSource property. So, we suggest you make sure the data added, updated, or deleted on the actionBegin event is not updated with the Schedule dataSource. In the below example, we have prevented adding the appointment by setting args.cancel to true and preventing merging the added data to the Schedule dataSource. If you are still having issues, please share the below details to proceed further.

  • Reproduce the issue in our shared sample,
  • Issue reproducing sample.

Sample: https://stackblitz.com/edit/ej2-react-ts-schedule-prevent-adding-actionbegin-event?file=App.tsx


export const App = () => {

  let scheduleObj;

  const [datasetData] = useState([]);


  async function addSchedule(addedData) {

    // Don't update the variable bind to the Schedule eventSettings dataSource property

    // setData(data.concat(addedData));



  return (

    <ScheduleComponent  eventSettings={dataSource: data }} actionBegin={async (args=> { if (args.requestType === 'eventCreate') { addSchedule(args.addedRecords) } args.cancel = args.requestType === 'eventCreate'; }}>





Ravikumar Venkatesan

Live Chat Icon For mobile
Up arrow icon