Topic: How to initialize WYSIWYG on a dynamically generated HTML element?
Simple question - how do you initialize WYSIWYG on a dynamically generated HTML element?
For example, to initialize form-outline on dynamically generated HTML elements, one would do:
document.querySelectorAll( '.form-outline' ).forEach( ( element ) =>
{
new mdb.Input( element ).init();
} );
To start off with initializing WYSIWYG on dynamically generated HTML elements I have the following so far...
document.querySelectorAll( '.wysiwyg' ).forEach( ( element ) =>
{
// what to do here?
} );
Thank you for your help.
I tried that already (it was the first thing I tried) - but when I do that, I get an error -
all.min.js:323 Uncaught TypeError: Illegal invocation
at Object.find (all.min.js:323)
at o.value (all.min.js:323)
at new o (all.min.js:323)
at HTMLTextAreaElement.<anonymous> (index.js?v=10:199)
at Function.each (jquery-3.5.1.min.js:2)
at S.fn.init.each (jquery-3.5.1.min.js:2)
at Object.processElements (index.js?v=10:197)
at Object.complete (index.js?v=10:338)
at c (jquery-3.5.1.min.js:2)
at Object.fireWith (jquery-3.5.1.min.js:2)
After checking the documents some more, it looks like I cannot use WYSIWYG on a textarea element - I must be using a div element instead. Unfortunately, there are attributes that I need to have set on the textarea element for my code to work -- so I need to do some thinking.
In fact, WYSIWYG must be initialized on a div element. You can add these attributes via JS.
document.querySelector('.wysiwyg-textarea').dataset.myCustomAttribute = 'value';
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: 3.2.0
- Device: All
- Browser: All
- OS: All
- Provided sample code: No
- Provided link: No