wake-up-neo.com

Wie kann ich mit Javascript einen Textbereich dynamisch als tinyMCE-Editor rendern (in WordPress)?

Ich habe ein Plugin, mit dem der Benutzer dynamisch Abschnitte hinzufügen kann, in denen der tinyMCE-Editor enthalten sein muss. Die jQuery klont eine div und legt sie in einem Container ab. Eines der Eingabefelder ist ein Textfeld, das folgendermaßen eingerichtet ist:

<textarea name="sectionContent_1" id="sectionContent_1"></textarea>

Ich muss den Textbereich durch den tinyMCE-Editor ersetzen.

Ich habe angeschaut:

Wie lade ich wp_editor () über AJAX/jQuery und verwende wordpress wp_editor in dynamic/ajax html

Beides scheint bei uns nicht zu funktionieren

Ich habe dies in dem Trigger versucht, der aufruft, um den Textarea-Abschnitt hinzuzufügen:

$(this).parent().find('.sectionOptions').html(ctHolder);

var textAreaID = 'sectionContent_'+sectionID;

tinyMCE.execCommand('mceRemoveEditor', true, textAreaID);
tinyMCE.execCommand('mceAddControl', false, textAreaID);

In diesem Beispiel füge ich die geklonten Daten (ctHolder) zum .sectionOptions hinzu, setze die ID des Textbereichs zurück, setze den Editor auf die ID zurück und füge dann der ID die Steuerung hinzu ... dies funktioniert nicht, scheint jedoch der gängigste Vorschlag zu sein.

3
dcp3450
tinymce.remove();
tinymce.init();

Das funktioniert gut!

Das hat den Trick gemacht:

var textAreaID = 'sectionContent_' + sectionID;
$(this).parent()
    .find('.sectionOptions')
    .html(ctHolder).ready(
        function() {
            tinyMCE.execCommand('mceAddEditor', false, textAreaID); 
        }
    );

Wordpress 3.9 verwendet tinyMCE 4.x, daher wurde "mceAddControl" in "mceAddEditor" geändert. Außerdem habe ich den Aufruf in eine Ready-Funktion gestellt, damit in jquery tinyMCE erst ausgeführt wird, nachdem der Textbereich auf dem Dom geladen wurde.

0
dcp3450