Running JS before save
Hello,
I have created a rather complex page builder with the Builder component in which the previews are interactive iframes.
When saving the form, I want to save the contents/state of some Quill editors in these iframes to the corresponding block data. While I have a working JS function that gathers the data from the iframe and sets the state using @this.set, I am not sure how/when to use it, or if this approach is even correct.
I thought I could hook it up in the Builder dehydrate event using $livewire->js('updateState()'). While this works, the changes only apply on a second save, likely because the saving process doesn't wait until this JS function is completed, so the iframe state gets updated too late.
One way could be to update state on every change, but I would think that causes performance issues. Another would be to create my own debounce, but that still adds unnecessary state updates. I've thought about Livewire entangle, but I am not sure how to implement it since the "field" is a Quill editor inside an iframe.
I have created a rather complex page builder with the Builder component in which the previews are interactive iframes.
When saving the form, I want to save the contents/state of some Quill editors in these iframes to the corresponding block data. While I have a working JS function that gathers the data from the iframe and sets the state using @this.set, I am not sure how/when to use it, or if this approach is even correct.
I thought I could hook it up in the Builder dehydrate event using $livewire->js('updateState()'). While this works, the changes only apply on a second save, likely because the saving process doesn't wait until this JS function is completed, so the iframe state gets updated too late.
One way could be to update state on every change, but I would think that causes performance issues. Another would be to create my own debounce, but that still adds unnecessary state updates. I've thought about Livewire entangle, but I am not sure how to implement it since the "field" is a Quill editor inside an iframe.