Magento Minicart not clear after delete all product programatically

Question

I have customized mini-cart. and place one new button Clear shopping cart. it's work fine. all item are deleted successfully. but mini cart total not updated in Magento 2. total updated only by one item.

check snap.

Answer 1

To update the mini-cart in you need to create a sections.xml in your module etc/frontend directory.

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Customer:etc/sections.xsd">
    <action name="checkout/cart/add">
        <section name="cart"/>
    </action>
</config>

Just replace checkout/cart/add with your modulename/controller/actionname and clear your webshop cache. You can also find the same thing in magento-checkout module from below path,

app\code\Magento\Checkout\etc\frontend\sections.xml

Magento does this job from below path (Just for debugging purpose),

Magento\Customer\view\frontend\web\js\customer-data.js

$(document).on('ajaxComplete', function (event, xhr, settings) {
    var sections,
        redirects;

    if (settings.type.match(/post|put|delete/i)) {
        sections = sectionConfig.getAffectedSections(settings.url);

        if (sections) {
            customerData.invalidate(sections);
            redirects = ['redirect', 'backUrl'];

            if (_.isObject(xhr.responseJSON) && !_.isEmpty(_.pick(xhr.responseJSON, redirects))) { //eslint-disable-line
                return;
            }
            customerData.reload(sections, true);
        }
    }
});

---

Alternatively, you can also do by adding just piece of javascript code on your AJAX (I am assuming you are doing this operation by AJAX)

require([
           'Magento_Customer/js/customer-data'
        ], function (customerData) {
            var sections = ['cart'];
            customerData.invalidate(sections);
            customerData.reload(sections, true);
        });