javascript - WordPress 附件分类复选框组未保存在 GridView 中

Question

我创建了一个分类法并将其附加到附件或媒体。

我正在使用高级自定义字段添加一个显示为复选框组的分类字段。它将字段正确添加到网格和 ListView 中的附件页面。

在 ListView 中，字段会正确更新，但在 GridView 中，它只会保存最后单击的复选框。这是由某种 onclick 函数引起的，该函数在单击每个复选框时触发 admin-ajax。因此，它只发送单击框的值。我正在尝试找到一种方法来更改 js 函数以添加复选框组和多选。

更新:我已将函数追踪到 onchange。

功能:保存

文件:media-views.min.js

复制问题的代码:

分类法:

function cptui_register_my_taxes() {
    $labels = array(
        "name" => __( "Image Tags", "" ),
        "singular_name" => __( "Image Tag", "" ),
    );
    $args = array(
        "label" => __( "Image Tags", "" ),
        "labels" => $labels,
        "public" => true,
        "hierarchical" => false,
        "label" => "Image Tags",
        "show_ui" => true,
        "show_in_menu" => true,
        "show_in_nav_menus" => false,
        "query_var" => true,
        "rewrite" => false,
        "show_admin_column" => false,
        "show_in_rest" => false,
        "rest_base" => "imagetags",
        "show_in_quick_edit" => false,
    );
    register_taxonomy( "imagetags", array( "attachment" ), $args );
}
add_action( 'init', 'cptui_register_my_taxes' );

自定义字段:

if( function_exists('acf_add_local_field_group') ):
    acf_add_local_field_group(array(
        'key' => 'group_5bc3f242c39e3',
        'title' => 'Gallery - Image Tags',
        'fields' => array(
            array(
                'key' => 'field_5bc3f249f009c',
                'label' => 'Image Tags',
                'name' => 'new_image_tags',
                'type' => 'taxonomy',
                'instructions' => '',
                'required' => 0,
                'conditional_logic' => 0,
                'wrapper' => array(
                    'width' => '',
                    'class' => '',
                    'id' => '',
                ),
                'taxonomy' => 'imagetags',
                'field_type' => 'checkbox',
                'add_term' => 1,
                'save_terms' => 1,
                'load_terms' => 1,
                'return_format' => 'id',
                'multiple' => 0,
                'allow_null' => 0,
            ),
        ),
        'location' => array(
            array(
                array(
                    'param' => 'attachment',
                    'operator' => '==',
                    'value' => 'all',
                ),
            ),
        ),
        'menu_order' => 0,
        'position' => 'normal',
        'style' => 'default',
        'label_placement' => 'top',
        'instruction_placement' => 'label',
        'hide_on_screen' => '',
        'active' => 1,
        'description' => '',
    ));

endif;

如果需要，您还可以使用以下代码删除默认分类法字段。它不会影响代码，但会删除文本字段:

// Remove taxonomy from the attachment pages so the acf taxonomy can work
add_action( 'admin_menu', function (){ remove_meta_box('imagetagsdiv', 'attachment', 'side' ); } );

// Add this in to remove it from the popup editor
add_filter( 'attachment_fields_to_edit', function( $fields ){
    unset($fields['imagetags']); 
    return $fields;
} );

发现问题现在寻找解决方案

打开 wp-includes/js/media-views.js - 行:8353

_.each( this.$el.serializeArray(), function( pair ) {
    data[ pair.name ] = pair.value;
});

他们似乎使用此代码来防止重复，但实际上它删除了所有可以作为数组提交的内容。

注意:这是WP默认加载.min版本的完整文件

Answer 1

可以通过覆盖原型(prototype)函数 ( wp.media.view.AttachmentCompat.prototype.save() ) 来解决这个问题，如下所示:

add_action( 'admin_print_footer_scripts', 'so52810006', 11 );
function so52810006() {
    // Make sure the media-views script has been enqueued.
    if ( ! did_action( 'wp_enqueue_media' ) ) {
        return;
    }
    ?>
<script>
wp.media.view.AttachmentCompat.prototype.save = function( event ) {
    var data = {};

    if ( event ) {
        event.preventDefault();
    }

    _.each( this.$el.serializeArray(), function( pair ) {
        if ( /\[\]$/.test( pair.name ) ) {
            if ( undefined === data[ pair.name ] ) {
                data[ pair.name ] = [];
            }
            data[ pair.name ].push( pair.value );
        } else {
            data[ pair.name ] = pair.value;
        }
    });

    this.controller.trigger( 'attachment:compat:waiting', ['waiting'] );
    this.model.saveCompat( data ).always( _.bind( this.postSave, this ) );
};
</script>
    <?php
}

如您所见，主要部分在这里，它正确构建了 data通过考虑 字段名称 这是 pair.name — 即是否以 [] 结尾表示一个数组值。

_.each( this.$el.serializeArray(), function( pair ) {
    if ( /\[\]$/.test( pair.name ) ) {
        if ( undefined === data[ pair.name ] ) {
            data[ pair.name ] = [];
        }
        data[ pair.name ].push( pair.value );
    } else {
        data[ pair.name ] = pair.value;
    }
});

在 WordPress 4.9.8 和 ACF 5.7.7 上经过尝试和测试。