Detecting step editor unmount
Opened this issue · 6 comments
Hi Bart,
when using a custom step editor in the react designer, i have the problem to loose the
current changes in the form when the user accidentally clicks into the editor space
and the stepeditor component gets unmounted.
I remember you wrote somewhere that this is currently not possible in the react version,
but do you have an idea how to work around this ?
Thanks a lot
Tilo
Hello @tskomudek,
basically you can always save the latest value in the step like:
<input type="text" ... onChange={e => setProperty('x', e.value)} />
So in the definition you will have allways the latest changes.
If you have a save step between changing values and applying them, then you can create a hidden property in the step, such as deltaX
.
<input type="text" ... onChange={e => setProperty('deltaX', e.value)} />
During saving changes you need to move values to a final property (deltaX => x).
@tskomudek have you resolved the problem?
Not really.
Yes, i can store the modified data somewhere, but i'd rather ask the user if he wants to navigate away from the current step without saving. Do you have any other idea how to achive this ?
Thx
Tilo
It looks like you need a canCloseEditor
callback or something like this. Yeah, it's not available now.
Maybe a temporary solution would be to use the isSelectable
callback 🤔, something like:
isSelectable: (step) => {
if (hasUnsavedChanges()) return window.confirm('You have unsaved data in the editor...');
// ...
}
When i integrated sequential-workflow-designer-angular in my existing project in place of router outlet but its not getting initialised properly...svg not taking full height and toolbox not getting initialized
I followed angular demo example -initialize with angular
please let me know what could be the reason
thanks a lot!!
@ShraddhaFutrey it looks like the parent layers have not set any height constraints. The designer doesn't stretch parents, it adjusts to available space. You can check this theory by setting CSS:
.sqd-designer {height: 900px;}
BTW: please don't add comments to not related threads.