event resizestart issue

[Richard Craig]

I want the user to confirm an event resize (and move etc) and store the initial state of the event then compare it to the final detail to show a dialog.

In the resizeStart I can console.log(args) and everything works ok.

As soon as I add to store the initial state, the drag resize stops working. The resizeStart event triggers but the on-screen resizing doesn't work.

e.g.

    onApptResizeBegin(args) {

        console.log(args);

        this.setState({apptChangeDetail: args.data}); <-- adding this stops resizing

    }

Anybody know why this is happening, and how to solve it?

Thanks

[Vengatesh Maniraj]

Hi Richard, 

 

Greetings from Syncfusion Support. 

 

The resizeStart/resizeStop and dragStart/dragStop  events trigger only when we manually handle the events/appointment and these events would not be triggered while the on-screen resizing. Currently, we do not have any other events to trigger while the on-screen resizing. 

 

Please let us know if you need any other assistance. 

 

Regards, 

Vengatesh 

[Richard Craig]

Thanks  for the reply Vengatesh

I'm not looking to get an event during the resize, I just want to store the original appointment details when the resize starts and compare to the details after resize so I can get the user to confirm the change and show the change details.

When I add the setState to resizeStart, the resizing with the mouse stops working.

I guess it's because setState causes a re-render, so I'm going to try just using a local variable to save the details.

[Vengatesh Maniraj]

Hi Richard, 

Thanks for the update. 

We have checked your shared details and we suspect that your requirement is to compare the original appointments with the same one after resizing it. We already have inbuild events that resizeStart and resizeStop which help us to get the original appointment’s data before start resizing by making use of resizeStart and get the updated data once we resized the appointment by making use of resizeStop like below. 

 

onResizeStart(args){ 

  var originalData = args.data; 

  console.log('Original data before resizing' + originalData); 

} 

onResizeStop(args){ 

  var updatedData = args.data; 

  console.log('After resizing' + originalData); 

} 

 

Sample: https://stackblitz.com/edit/react-njia3g?file=index.js 

For more reference please visit the below API links  

resizeStart: https://ej2.syncfusion.com/react/documentation/api/schedule/#resizestart 

resizeStop: https://ej2.syncfusion.com/react/documentation/api/schedule/#resizestop 

If we misunderstood your requirement please let us know with clear details to serve you better. 

Regards, 

Vengatesh.