12

WordPressプラグインを作成しています。AJAX を介して製品を追加するときにエディターを表示する機能がありますが、エディターが正しく表示されません。

ユーザーは好きなだけ製品を追加できるため、複数の wp_editor() があることに注意してください。

添付のスクリーンショットを参照してください。

ここに画像の説明を入力

次のコードを使用しました。

PHP

public function add_product() {

        // Get product id
        $prod_id = filter_input(INPUT_POST, 'pid');

        // WordPress WYSIWYG Editor
        wp_editor("Test Content", "textarea" . $prod_id, array('textarea_name' => 'text'));
        wp_die();
}

Jクエリ

$('.add-prod').live('click', function () {

        var prod_id = $('.prod-id').val();
        var data = {
            action: 'add_prod',
            pid: prod_id
        };
        $('#update-msg').show();

        $.post(ajaxurl, data, function (result) {
            $('#the-list').append(result);
            $('#update-msg').hide();
        });

        return false;
});

インターネットのソリューションを使用しましたが、部分的に機能していません。次のコードを使用しました：

PHP

wp_editor($product->prod_desc, $textarea_id, array('textarea_name' => 'text'));
\_WP_Editors::enqueue_scripts();
print_footer_scripts();
\_WP_Editors::editor_js();

Jクエリ

var eid = '#item-list';
switchEditors.go(eid, 'tmce')
quicktags({id: eid});
//init tinymce
tinyMCEPreInit.mceInit[eid]['elements'] = eid;
tinyMCEPreInit.mceInit[eid]['body_class'] = eid;
tinyMCEPreInit.mceInit[eid]['succesful'] = false;
tinymce.init(tinyMCEPreInit.mceInit[eid]);

そして、上記のコードはこれを行います：

ここに画像の説明を入力

4

2 に答える 2

3

ajax応答のみを返すajax呼び出しを行っているため、明らかにwp_editorは表示されませんが、そのページのjavascriptによって構築されたwpエディターは表示されません。要するに、ajax呼び出しはサーバー側のテキスト応答を取得できますが、クライアント側に構築され、処理にjavascriptプロセッサーを必要とするjavascriptエディターは取得できません。

以下は、エディタを機能させるために何ができるかの suedo の例です。

  1. ajax呼び出しが行われている「製品を追加」ボタンのすぐ下で、phpコードを使用してエディターを印刷し、その表示をnoneに設定して、エディターがページに表示されないようにします。

例えば

<div class="wp-editor-wrapper" style="display: none;">
     <?php wp_editor("Test Content", "textarea" . $prod_id, array('textarea_name' => 'text')); ?>
</div>

  1. ajax 応答の php 関数は、テキスト コンテンツのみを返す必要があります。エディター自体ではなく、次のようになります。

    パブリック関数 add_product() {

        // Get product id
    $prod_id = filter_input(INPUT_POST, 'pid');

    // if $prod_id is used here, use it to get content
    echo "Test Content";
    wp_die();

    }

  2. テキスト コンテンツの応答を受信したら、jQuery を使用して「wp-editor-wrapper」div のクローンを作成し、それを textarea の代わりに追加して、そのコンテンツを ajax 応答から設定します。

于 2015-12-20T06:55:04.117 に答える