it-swarm-ja.com

投稿作成時に添付ファイルを並べ替えるカスタム機能 - ほぼそこ

私は私がやっているカスタムの事でいくつかの問題を抱えています。

カスタム投稿タイプのメタボックスにカスタム画像アップローダを実装しました。今私は私がアップロードされた画像を並べ替えることを可能にする方法を考え出そうとしています。私はjQuery Sortableがユーザーが画像を表示する順番にドラッグ&ドロップすることができるようにするのに便利な方法であることを発見しました添付データ "menu_order"によって決まるので、jQuery Sortableで作成したmenu_orderを保存するための機能が必要です。

さて、これは私が持っているものの簡単な例です: http://jsfiddle.net/LN4sA/

各添付ファイルと共に、添付ファイルのIDと、メニューの順序で添付ファイルの現在の位置を格納するフィールドを含む非表示の入力フィールドを追加しました。

添付ファイルのIDは、基本的なWP PHP($ attachment-> ID)で簡単に取得できます。しかし、#att_orderに適切なmenu_orderを設定する簡単な方法はまだ見つかっていません。だからここで私は誰かがとても親切になるなら私はいくつかのヘルプ/入力をお願いします。

実際の情報を保存するには、入力フィールドから値を取得するためにajaxを使用します。

add_action('save_post', 'save_attachment_position');
function save_attachment_position(){
    global $post;
    if ($post->post_type == 'work') { ?>
        <script type="text/javascript">
        //<![CDATA[
            jQuery.ajax({
                type: 'post',
                url: ajaxurl,
                data: {
                    action: 'order_attachment',
                    att_ID: jQuery(this).parents('.attachment').find('#att_id').val(),
                    att_order: jQuery(this).parents('.attachment').find('#att_order').val(),
                    _ajax_nonce: jQuery('#ordernonce').val(),
                    post_type: 'attachment'
                }
            });
        //]]>
    </script><?php 
    }
}

そして、wp_update_postを使って添付データを更新します。

add_action('wp_ajax_order_attachment', 'order_attachment');
function order_attachment($post) {
    $attachmentdata = array();
    $attachmentdata['ID'] = $_POST['att_ID'];
    $attachmentdata['menu_order'] = $_POST['att_order'];
    wp_update_post($attachmentdata);    
}

私はここである種のループが必要であることを知っています、しかし私はそれを解決します。

何か案は?

ありがとう

4
INT

自分の意図がコードに対するものであるかどうかは完全にはわかりません。残念ながら、あなたが提供したものがうまく機能しないことに気付いたので、提供されるコードの一部を書き換えてより実用的なソリューションにしました。

このコードはajax経由ではなくsaveにメタボックスの添付ファイルの順番を保存するのに役立ちますが、実際にはあらゆる種類の変更を保存する理由はありません(ありますか?)。

コードの先頭で投稿タイプを調整できるように、コードをリファクタリングしました。私があなたがエンキュー呼び出しで何を目指しているのかはっきりしていません、そしてそれがあなたのやり方で呼び出すことができないこともかなり確実です、それにしてもポストエディタページで必要とされませんでした。エディタ画面にロードされます。

これに一撃を与えて、あなたがどうやって乗るかを見てください。(これは実用的なサンプルであることに注意してください)..

// Not applicable to my testing, but left it in because i'm sure it's appropriate to your usage
add_theme_support( 'post-thumbnails' );
add_image_size( 'editor-thumb', 130, 72, true );

// Quicker to update one line than several, only reason it's defined here
$my_post_type = 'book';

// Add metabox on the proper metabox hook
add_action( 'add_meta_boxes_' . $my_post_type, 'add_image_sortable_box',   2000 );

// Fire jQuery only on the appliable pages
add_action( 'admin_footer-post.php',           'add_sortable_to_elements', 2000 );
add_action( 'admin_footer-post-new.php',       'add_sortable_to_elements', 2000 );

function add_image_sortable_box() {
    global $my_post_type;
    add_meta_box( 'test-image-thing', 'Sortable Attachments Test', 'do_image_metabox_thingy', $my_post_type, 'side', 'default' );
}

function add_sortable_to_elements() { 
    ?>
    <script type="text/javascript">
    //<![CDATA[
        jQuery(document).ready(function($) {
            $('#attachmentcontainer').sortable();   
        });
    //]]>
    </script>
    <?php
}

function do_image_metabox_thingy( $p ) { 

    // No global statement needed here, the hook this function is attached to gives you the post object

    $args = array(
        'order'          => 'asc',
        'orderby'        => 'menu_order',
        'post_type'      => 'attachment',
        'post_parent'    => $p->ID,
        'post_mime_type' => 'image',
        'post_status'    => null,
        'numberposts'    => -1,
    );

    $attachments = get_posts( $args );

    if( $attachments ) :

        // Only need 1 nonce to cover the lot
        wp_nonce_field( 'my_attachment_sort', 'attachment_sort_nonce' );
    ?>

    <div class="imageuploader">
        <div id="attachmentcontainer">

        <?php
        foreach( $attachments as $attachment ) :
            $attachmentid = $attachment->ID;
            $editorimage = wp_get_attachment_image_src( $attachment->ID, 'editor-thumb', false, false);
        ?>

            <div class="attachment" id="test-<?php echo $attachment->ID; ?>">
                <div class="image">
                    <img width="100" height="auto" src="<?php echo $editorimage[0]; ?>" />
                    <input type="hidden" name="att_id[]" id="att_id" value="<?php echo $attachment->ID; ?>" />
                </div>
            </div>

        <?php 
        endforeach;
        ?>

        <div style="clear: both;"></div>
        </div>      
    </div>

    <?php
    endif;
}

// Updates the attachments when saving
add_filter( 'wp_insert_post_data', 'test_meta_save', 1000, 2 );

function test_meta_save( $data, $_post_vars ) {
    global $my_post_type;
    if( $my_post_type != $data['post_type'] || !isset( $_post_vars['attachment_sort_nonce'] ) )
        return $data;

    if( defined('DOING_AUTOSAVE') && DOING_AUTOSAVE )
        return $data;

    if( !wp_verify_nonce( $_post_vars['attachment_sort_nonce'], 'my_attachment_sort' ) )
        return $data;

    global $post_ID;

    if( !current_user_can( 'edit_post', $post_ID ) ) 
        return $data;

    if( isset( $_post_vars['att_id'] ) ) {
        foreach( $_post_vars['att_id'] as $img_index => $img_id ) {
            $a = array(
                'ID' => $img_id,
                'menu_order' => $img_index
            );
            wp_update_post( $a );
        }
    }
    return $data;
}

もちろん、投稿タイプの値を必ず切り替えてください。bookは私のテスト用投稿タイプです.. :)

質問がある場合は、元の質問に追加してから、この回答にコメントを投稿してください。

5
t31os