web-dev-qa-db-ja.com

Ajax呼び出しの後にwp.mediaを更新する

私はメディアマネージャにタブを追加し、他のソースからのものを追加できるプラグインを作成しています。これを使ってタブを追加すると、iframeが生成されます。

add_filter('media_upload_tabs', 'add_myUpload_tab');
function add_myUpload_tab($tabs) {
    $tabs['myTab'] = "My tab";
    Return $tabs;
}
add_action('media_upload_myTab', 'add_myUpload_save_page');
function add_myUpload_save_page() {
    wp_iframe( 'myTab_save_frame' );
}
function myTab_save_frame()
{
    echo media_upload_header();
    ?><iframe to my other source/><?php
    /*** More code below ***/
}

したがって、要するに、iframeにはiframeがあります。 :)例ではwpコーデックスにiframeがありましたが、それがなくても動作することがわかります。なんでも。

私が自分のiframeで遊びながらこれをボタンを押すと、iframeのこのページがメッセージを送ります。上記の「More code below」に、このコードがあります。

<script>
    window.addEventListener('message', function(event) {
        //Setup variables
        var answer = event.data,
            wp = parent.wp;
        answer.url = answer.url.replace(/\.\w+$/ig,'');
        var data = {
          'action': 'add_my_image',
          'file': answer.url
        };
        jQuery.post(ajaxurl, data, function(response) {
            alert('My image was uploaded');
            /** From here and i below I want to do my wp.media stuff **/
        });
    });
</script>

そして、はい、私は私が一回だけを送っていないのを知っています。これはテスト用です。すべてうまくいきます。私が今達成したいのは、 "Add media" - > "library"タブでwp.mediaにライブラリをリフレッシュさせることです。そしてこれが私が失敗するところです。

私は見つけました このスレッド しかしここでは本当に役に立ちません。ご覧のとおり、私はwp_iframeの中にいるので、wpをparent.wpとして宣言してwp.mediaのものを呼び出します。

これまでのところ、ライブラリを表示するように状態を変更しましたが、更新はしていません。私はこれを行うことができます：

wp.media.frame.setState('insert');

しかし奇妙なことに、この後これ以上jsは実行されていません。たとえば、私がそうであれば、console.log（ 'Hello world'）;という行を追加します。この行の後、コンソールは沈黙しています。

そのため、状態を設定する前にリフレッシュする必要があると思いますか。

別のフレーム/状態/タブ（ライブラリのもの）を選択し、それを更新し、（可能ならば - 必要ではないが）それに切り替える方法はありますか？

uploadsjavascriptmediaiframemedia-modal
4
gubbfett

だから、私はあなたのリンクをたどり、これは私のために働いています。このテストは私のアップロードコールバックに対しても同じように動作するので、うまくいけばあなたのためにも動作します。

Iframeの中で

function myTab_save_frame()
{
    global $redir_tab;

    $redir_tab = 'mytab';

    media_upload_header(); ?>

    <button>Test Trigger</button>

    <script>
        var switchAndReload = function() {

            // get wp outside iframe

            var wp = parent.wp;

            // switch tabs (required for the code below)

            wp.media.frame.setState('insert');

            // refresh

            if( wp.media.frame.content.get() !== null) {
                wp.media.frame.content.get().collection.props.set({ignore: (+ new Date())});
                wp.media.frame.content.get().options.selection.reset();
            } else {
                wp.media.frame.library.props.set ({ignore: (+ new Date())});
            }
        };

        jQuery('button').on('click', function(evt){

            // do upload logic...

            // upload completed.

            // refresh library!

            switchAndReload();
        });
    </script>
    <?php 
}
5
jgraup