quilljs-rails
quilljs-rails copied to clipboard
How can I initialise Quill on a textarea in a dynamically added div by Cocoon?
I'm using Cocoon to create a nested form. Cocoon offers the following method when the div is added to the DOM:
cocoon:after-insert
How might I initialise Quill on a textarea in the dynamic nested form?
Make sure that the cocoon containers have the class "quill_container"
Since the divs are dynamically added, we would need to reinitialize the Quill instances. One way to do this by calling the following in the cocoon:after-insert
block
Quilljs.loadDefaults();
One issue that might develop with this method is that it might create a Quill editor container on top of another initialized editor. You might need to destroy and reinitialize those containers every time you insert a new cocoon container.
Pseudo code:
- Select all the containers (most likely they have a
ql-editor
class) on after-insert - destroy all the containers on after-insert
- Make sure each container has the class 'quill_container'
- Reinitialize all containers with
Quilljs.loadDefaults();