[FIXED] How to hide product in magento 2 checkout and cart With one step checkout Module

Issue

I am using one step checkout module from magestore and I want to hide some products in the magento checkout these products are pre added automatically with every order for example packing material for these products So I need to hide these products in checkout and cart How can I do this one step checkout module it is using knockoutJS so i am not very familiar with this. Thanks for your response in advance.

I have tried hiding using CSS but that is not what I want to do. So i want to hide these products programmatically.

/*
 * *
 *  Copyright © 2016 Magestore. All rights reserved.
 *  See COPYING.txt for license details.
 *  
 */
/*browser:true*/
/*global define*/
define(
    [
        'jquery',
        'ko',
        'Magento_Checkout/js/model/totals',
        'uiComponent',
        'Magento_Checkout/js/model/step-navigator',
        'Magento_Checkout/js/model/quote',
    ],
    function ($, ko, totals, Component, stepNavigator, quote) {
        'use strict';
        return Component.extend({
            initialize: function () {
                this._super();
                var self = this;
                totals.isLoading.subscribe(function () {
                    if (totals.isLoading() == true) {
                        self.showOverlay();
                    } else {
                        self.hideOverlay();
                    }
                });
            },
            defaults: {
                template: 'Magestore_OneStepCheckout/summary/cart-items'
            },
            totals: totals.totals(),
            getItems: totals.getItems(),
            getItemsQty: function() {
                return parseFloat(this.totals.items_qty);
            },

            showOverlay: function () {
                $('#ajax-loader3').show();
                $('#control_overlay_review').show();
            },

            hideOverlay: function () {
                $('#ajax-loader3').hide();
                $('#control_overlay_review').hide();
            },


            isItemsBlockExpanded: function () {
                return quote.isVirtual() || stepNavigator.isProcessed('shipping');
            }

        });
    }
);

This is the actual cart-items.js file that i suppose containing the code of displaying products in checkout but i don't understand how to apply filter to hide products with this sku XXXXXXXXX or product Id XXXXX. This is the website i setup for testing purposes. http://13.232.223.99

Solution

I was not able to hide products through code But I finally managed to hide these products through JQuery code which is down below. I hope this can also help you.
You can also use the same code to hide product on other pages like cart and order confirmation page just the different between the elements.

For cart:

if($( "a:contains('demo2')" )){
var element1 = $( "a:contains('demo2')" );
element1.closest('tbody').remove();
}
if($( "a:contains('demo1')" )){
    var element2 = $( "a:contains('demo1')" );
    element2.closest('tbody').remove();
}

For Checkout:

if($( "h2:contains('demo2')" )){
var element1 = $( "h2:contains('demo2')" );
element1.closest('tr').remove();
}
if($( "h2:contains('demo1')" )){
    var element2 = $( "h2:contains('demo1')" );
    element2.closest('tr').remove();
}

Also to hide all products having 0.00 price:

if($( "font:contains('$ 0.00')" )){
    var element2 = $( "font:contains('$ 0.00')" );
    element2.closest('tr').remove();
}

i hope this answer provide you some help. If yes don't forgot to hit the upvote Button.

Answered By - Manish Kumar

Answer Checked By - Timothy Miller (PHPFixing Admin)