Wie lade ich wp_editor über AJAX?


17

Weiß jemand, wie man wp_editor über AJAX in WordPress lädt?

Mein Markup und mein Editor werden ordnungsgemäß geladen, aber die Editorsteuerelemente werden nicht ordnungsgemäß geladen. Dies kann daran liegen, dass Javascript im AJAX-Aufruf nicht ausgeführt wird.

Jede Hilfe wäre dankbar.


Es ist eine verdammt gute Sache, sich an die Arbeit zu machen. Schauen Sie sich einen Teil des Codes von Carrington Build oder Advanced Custom Fields an (glaube ich ...). Seien Sie einfach bereit, frustriert zu sein.
MikeNGarrett

Antworten:


7

Das Hauptproblem sind die fehlenden Skripte. Die in die Warteschlange gestellten Skripte _WP_Editors::enqueue_scripts()werden niemals gedruckt. Gleiches gilt für _WP_Editors::editor_js().

Das müssen Sie also in Ihrem AJAX-Callback-Handler tun. Ich habe ein Demo-Plugin geschrieben und auf GitHub gestellt: T5 AJAX Editor .

Es gibt eine Klasse mit dem Namen Ajax_Editor. Seine Methode render()druckt den Editor auf AJAX-Anfragen.

public function render()
{
    if ( ! $this->validator->is_valid( TRUE ) )
        die( 'nope' );

    wp_editor( $this->data->get(), $this->editor_id, $this->settings );
    \_WP_Editors::enqueue_scripts();
    print_footer_scripts();
    \_WP_Editors::editor_js();

    die();
}

Die genaue Reihenfolge ist wichtig und darf die()am Ende nicht vergessen werden . Was noch nicht funktioniert, ist der Medien-Upload. Ich erhalte einen JavaScript-Fehler, wenn ich versuche, das einzuschließen.

Beachten Sie, dass Sie mit dem Aufruf print_footer_scripts();mehr als erwartet erhalten: Einige Plugins (z. B. Query Monitor) registrieren ihre Skripte auch für AJAX-Anforderungen, selbst wenn sie dort nicht benötigt werden.


Vielen Dank! Du hast mich vor zwei Tagen gerettet, als ich versuchte, Arbeit zu finden! Das einzige, was damit zu tun ist, wenn Sie es in einen benutzerdefinierten Beitragstyp
einfügen

Für alle, die nach WP 4.8 suchen, können Sie dies einfacher (und sauberer) über die JS-API tun wp.editor.initialize: wordpress.stackexchange.com/a/274608/76440
majick

0

Nachdem ich damit zu kämpfen hatte, fand ich die Ein-Zeilen-Lösung, die funktioniert, und füge im Rückruf hinzu:

tinymce.execCommand( 'mceAddEditor', true, element.id );

Keine Ahnung, warum ich keine Dokumentation in Tinymce finden konnte.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.