Cara memuat wp_editor melalui AJAX

17

Adakah yang tahu bagaimana cara memuat wp_editor melalui AJAX di WordPress?

Markup dan editor saya dimuat dengan benar tetapi kontrol editor tidak dimuat dengan benar, mungkin karena Javascript tidak berjalan di panggilan AJAX.

Bantuan apa pun akan dihargai.

pengguna17108
sumber
Ini hal yang hebat untuk bekerja. Lihat beberapa kode dari Carrington Build atau Advanced Customs Fields (saya pikir ...). Bersiaplah untuk frustrasi.
MikeNGarrett

Jawaban:

7

Masalah utama adalah skrip yang hilang. Script enqueued _WP_Editors::enqueue_scripts()tidak pernah dicetak. Hal yang sama berlaku untuk _WP_Editors::editor_js().

Jadi, Anda harus melakukannya di penangan panggilan balik AJAX Anda. Saya telah menulis plugin demo dan meletakkannya di GitHub: T5 AJAX Editor .

Ada satu kelas bernama Ajax_Editor. Metodenya render()mencetak editor pada permintaan AJAX.

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();
}

Urutan yang tepat itu penting, dan jangan lupa die()pada akhirnya. Yang belum berfungsi adalah unggahan media. Saya mendapatkan kesalahan JavaScript saat mencoba memasukkannya.

Perhatikan bahwa menelepon print_footer_scripts();akan memberi Anda lebih dari yang Anda harapkan: beberapa plugin (contohnya Query Monitor) mendaftarkan skrip mereka bahkan untuk permintaan AJAX, bahkan jika mereka tidak membutuhkannya di sana.

fuxia
sumber
Terima kasih banyak! Anda menyelamatkan saya dari 2 hari mencoba untuk mendapatkan pekerjaan! satu-satunya hal dengan ini, jika Anda ingin memasukkannya dalam jenis posting kustom, itu bertentangan dengan editor lain :(
numediaweb
bagi siapa pun yang mencari, setelah WP 4.8 Anda dapat melakukan ini dengan lebih mudah (dan bersih) melalui JS API wp.editor.initialize: wordpress.stackexchange.com/a/274608/76440
majick
0

Setelah bergumul dengannya, temukan solusi satu jalur yang berfungsi, di callback, tambahkan:

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

Tidak tahu mengapa saya tidak bisa menemukan dokumentasi di dalam tinymce.

Goran Jakovljevic
sumber