隐藏“简单产品”类型选项的“属性”选项卡

如何解决隐藏“简单产品”类型选项的“属性”选项卡

我在“简单产品”选项卡中添加了第三个复选标记选项，如下所示：

add_filter("product_type_options",function ($product_type_options) {

    $product_type_options["personalize"] = [
        "id"            => "_personalize","wrapper_class" => "show_if_simple","label"         => "Personalize","description"   => "personalize Products","default"       => "no",];

    return $product_type_options;

});

add_action("save_post_product",function ($post_ID,$product,$update) {

    update_post_meta(
          $product->ID,"_personalize",isset($_POST["_personalize"]) ? "yes" : "no"
    );

},10,3);

当这个自定义的“个性化”复选框被选中时，我需要隐藏“属性”选项卡。即，如果您单击“虚拟”选项复选框，“运输”选项卡将隐藏。同样，我需要“个性化”选项复选框以在选择时隐藏“属性”选项卡。

我试过了：

add_filter('woocommerce_product_data_tabs','misha_product_data_tabs' );
function misha_product_data_tabs( $tabs ){
 
    $tabs['attribute']['class'][] = 'hide_if_personalize';
    return $tabs;
 
}

但是它不起作用。你能帮忙吗？ 检查屏幕截图：https://snipboard.io/vhqMyA.jpg

解决方法

首先，您必须更新复选框更改时的元值。那么您可以使用此 hide_if_personalize 过滤器钩子添加类 yes 如果元值为 woocommerce_product_data_tabs。检查下面的代码。

add_filter("product_type_options",function ( $product_type_options ) {
    $product_type_options["personalize"] = [
        "id"            => "_personalize","wrapper_class" => "show_if_simple","label"         => "Personalize","description"   => "personalize Products","default"       => "no",];
    return $product_type_options;
});

add_filter('woocommerce_product_data_tabs','misha_product_data_tabs' );
function misha_product_data_tabs( $tabs ){
    $personalize = get_post_meta( get_the_ID(),"_personalize",true );
    if( $personalize == 'yes' ){
        $tabs['attribute']['class'] = 'hide_if_personalize';
    }
    return $tabs;
 }

add_action( 'wp_ajax_hide_attribute_if_personalize','hide_attribute_if_personalize' );
add_action( 'wp_ajax_nopriv_hide_attribute_if_personalize','hide_attribute_if_personalize' );
function hide_attribute_if_personalize(){
    $personalize = $_POST['personalize'];
    $product_id  = $_POST['product_id'];
    update_post_meta( $product_id,'_personalize',$personalize );
}

function add_custom_admin_js_css(){ 
?>
    <style type="text/css">
        li.attribute_options.attribute_tab.hide_if_personalize {
             display: none !important;
        }
    </style>
    <script type="text/javascript">
        (function($){
            $(document).ready(function(){

                $( document ).on('change','#_personalize',function(){
                    var personalize = 'no';
                    if( $(this).is(":checked") ){
                        $('li.attribute_options.attribute_tab').addClass('hide_if_personalize');
                        personalize = 'yes';
                    }else{
                        $('li.attribute_options.attribute_tab').removeClass('hide_if_personalize');
                    }

                    $.ajax({
                        url: '<?php echo admin_url('admin-ajax.php'); ?>',type: "post",data: {personalize:personalize,product_id:$('#post_ID').val(),action:'hide_attribute_if_personalize'},success: function( response ) {
                            
                        },error: function (jqXHR,exception) {
                            var msg = '';
                            if (jqXHR.status === 0) {
                                msg = 'Not connect.\n Verify Network.';
                            } else if (jqXHR.status == 404) {
                                msg = 'Requested page not found. [404]';
                            } else if (jqXHR.status == 500) {
                                msg = 'Internal Server Error [500].';
                            } else if (exception === 'parsererror') {
                                msg = 'Requested JSON parse failed.';
                            } else if (exception === 'timeout') {
                                msg = 'Time out error.';
                            } else if (exception === 'abort') {
                                msg = 'Ajax request aborted.';
                            } else {
                                msg = 'Uncaught Error.\n' + jqXHR.responseText;
                            }
                            console.log(msg);
                        },});


                });

            });
        })(jQuery);
    </script>
<?php }
add_action( 'admin_footer','add_custom_admin_js_css',10,1 );

经过测试并有效。

,

您可以通过 jQuery 脚本隐藏“属性”选项卡。

showHideAttributeTab() 脚本将在页面加载和点击“个性化”复选框时激活。

禁用 <input> 和 <select> 字段也很重要 添加属性表单以确保它们在保存时不被发送 产品。

事实上，用户可以为产品添加一个或多个属性，选中“个性化”复选框，最后保存产品。

如果只是简单地隐藏元素，确实用户看不到它们，但它们仍然会被 Ajax 函数捕获以保存属性。

要防止这种情况必须禁用“属性”选项卡的任何字段。然后，保存后，如果选中“个性化”复选框，所有属性将被删除。

添加

当“个性化”复选框未选中时，“常规”选项卡是 自动激活。

此外，如果“属性”选项卡处于活动状态并且用户选择“个性化”，则会自动激活“常规”选项卡以避免出现白色内容。

// adds script in Wordpress backend to show or hide attribute tab based on custom field
add_action( 'admin_footer','show_hide_attribute_tab' );
function show_hide_attribute_tab() {
    ?>
    <script type="text/javascript">
        function showHideAttributeTab() {
            if ( jQuery('#_personalize').is(':checked') ) {
                jQuery('li.attribute_options.attribute_tab').hide();
                jQuery('#product_attributes').hide();
                // disable all fields of the "Attributes" tab
                jQuery("#product_attributes input,#product_attributes select").each(function() {
                    jQuery(this).prop("disabled",true);
                });
                // if user enables "Attributes" tab,switch to general tab.
                if ( jQuery( '.attribute_options.attribute_tab' ).hasClass( 'active' ) ) {
                    jQuery( '.general_options.general_tab > a' ).trigger( 'click' );
                }
            } else {
                jQuery('li.attribute_options.attribute_tab').show();
                jQuery('#product_attributes').show();
                // enables all fields of the "Attributes" tab
                jQuery("#product_attributes input,false);
                });
                // switch to general tab
                jQuery("li.general_options.general_tab > a").trigger("click");
            }            
        }
        // runs the script when the page loads
        showHideAttributeTab();
        // runs the script when the "Personalize" checkbox is clicked
        jQuery("#_personalize").click(function() {
            showHideAttributeTab();          
        });
    </script>
    <?php
}

代码已经过测试并且可以工作。将它添加到您的活动主题的functions.php。