जब मैं कार्ट मैगेंटो 2 में उत्पाद जोड़ता हूं, तो मिनिकार्ट को पॉप अप करें

Question

मैं Magento 2.0.7 का उपयोग कर रहा हूं, और जो मैं करने की कोशिश कर रहा हूं वह कार्ट को पॉपअप करने के लिए है (शीर्ष दायां कार्ट अजाक्स मिनीकार्ट) जब मैं इसमें कोई उत्पाद जोड़ता हूं, तो मूल रूप से इसे ट्रिगर करें। मैंने कार्ट शो कक्षाओं में अपने शो में "शोकार्ट" वर्ग को जोड़ने की कोशिश की है, लेकिन अगर मैं ऐसा करता हूं, तो बटन बस गाड़ी को खोलता है, और उत्पाद को नहीं जोड़ता है।

Answer 1

इस साइट पर यह मेरा पहला उत्तर है। मैं पिछले दो दिनों से इस काम को करने की कोशिश कर रहा था और मैं आखिरकार इसे काम करने में सक्षम था, इसलिए मैं इसे साझा करना अच्छा होगा।

सबसे पहले आपको एक मॉड्यूल बनाने की आवश्यकता है:

• registration.php
• etc / module.xml
• देखने / दृश्यपटल / लेआउट / default.xml
• देखने / दृश्यपटल / टेम्पलेट्स / minicart_open.phtml
• देखें / दृश्यपटल / वेब / js / देखें / minicart_open.js

चरण 1. आपको साइट पर एक टेम्पलेट जोड़ने की आवश्यकता है। ऐसा करने का तरीका default.xml है

<referenceContainer name="content">
  <block class="Magento\Framework\View\Element\Template" name="minicart.autoopen" template="Company_ModuleName::minicart_open.phtml"/>
</referenceContainer>

चरण 2। फिर minicart_open.phtml के अंदर हमें अपने जेएस फ़ाइल (घटक) को कॉल करने की आवश्यकता है, इसे मिनीकार्ट के माता-पिता से जोड़कर। इस मामले में, [डेटा-ब्लॉक = 'मिनिकर्ट']। देखें इस लिंक अधिक जानकारी के लिए।

<script type="text/x-magento-init">
{
     "[data-block='minicart']" : {
        "Company_ModuleName/js/view/minicart_open" : {}
     }
}
</script>

चरण 3। और अंत में, minicart_open.js के अंदर, जादू कोड:

define(["jquery/ui","jquery"], function(Component, $){
    return function(config, element){
        var minicart = $(element);
        minicart.on('contentLoading', function () {
            minicart.on('contentUpdated', function () {
                minicart.find('[data-role="dropdownDialog"]').dropdownDialog("open");
            });
        });
    }
});

मूल रूप से यह कोड फ़ाइल की कार्यक्षमता को बढ़ाता है vendor/magento/module-checkout/view/frontend/web/js/view/minicart.js, और यह कहता है कि एक बार AJAX कॉल पूरा हो जाने पर (contentUpdated), मिनीकार्ट को खोला जाना चाहिए।

और यह यह है, बहुत सारे सिद्धांत के साथ एक सरल कार्य। आशा करता हूँ की ये काम करेगा।

Comments

इसने एक जादू की तरह काम किया। टी.के.एस!

— मदीना

एक अच्छा तय लगता है, यह एक मॉड्यूल होने की आवश्यकता क्यों है? क्या आपके विषय में उन परिवर्तनों का प्रभाव नहीं होगा?

— बेन क्रुक

@Pinicio से ऊपर दिए गए उत्तर के अलावा: ध्यान दें कि समाधान केवल तभी काम करेगा जब ajax का प्रयोग कार्ट में ऐड के लिए किया जाए: magento.stackexchange.com/questions/125681/…

— Soeren

यह कार्ट अपडेट पर काम करता है जब हम उत्पाद जोड़ते हैं तो यह काम करता है लेकिन जब हम कार्ट से आइटम निकालते हैं तो यह काम नहीं करना चाहिए। लेकिन उस समय भी काम कर रहा था।

— रौनक चौहान

यदि मैं मिनी कार्ट से किसी आइटम को हटाने का प्रयास करता हूं, तो आइटम डिलीट नहीं हो रहा है..या) एक बार मैं डिलीट आइकन पर क्लिक करता हूं, केवल पृष्ठ ताज़ा होने के बाद, हटाए गए आइटम को फिर से हटा दिया जा रहा है

— सुशीवम

Answer 2

यह केवल minicart.js फ़ाइल को संशोधित करके किया जा सकता है।

पर जाए vendor/magento/Magento_Checkout/view/web/js/view/minicart.js

प्रारंभ: कार्य के अंतर्गत, आप देखेंगे

$('[data-block="minicart"]').on('contentLoading', function (event) {

फ़ंक्शन को इस कोड से बदलें।

$('[data-block="minicart"]').on('contentLoading', function (event) {
            addToCartCalls++;
            self.isLoading(true);
            $('[data-block="minicart"]').on('contentUpdated', function ()  {
                $('[data-block="minicart"]').find('[data-role="dropdownDialog"]').dropdownDialog("open");       
                setTimeout(function() {
                $('[data-block="minicart"]').find('[data-role="dropdownDialog"]').dropdownDialog("close");
            }, 4000);
            });
        });

आप अपनी आवश्यकता के अनुसार टाइमआउट बदल सकते हैं।

कमांड चलाकर फाइल और क्लीन कैश अपलोड करें

php bin/magento cache:clean

चीयर्स!

Comments

मैं इस एक की कोशिश की, लेकिन काम नहीं किया, मैं

— insaurabh

सुनिश्चित करें कि आपके पास आपके विषय के अंतर्गत इस फ़ाइल विक्रेता / Magento / Magento_Checkout / view / web / js / view / minicart.js का कोई ओवरराइड नहीं है।

— अजेंद्र पंवार

आपको कभी भी सीधे कोर फाइल नहीं बदलनी चाहिए। इसके बजाय, इसे अपने थीम या कस्टम मॉड्यूल में बदलें।

— pinicio

खुशी है कि यह आपकी मदद की :)

— अजेंद्र पंवार

यह Magento 2.2.3 पर एक आकर्षण की तरह काम किया। Tks ढेर!

— मदीना

Answer 3

वैकल्पिक समाधान: चेक vendor/magento/module-catalog/view/frontend/web/js/catalog-add-to-cart.jsलाइन: 100

$(document).trigger('ajax:addToCart', form.data().productSku);

हम एक कस्टम js फ़ाइल जोड़ सकते हैं:

<script type="text/x-magento-init">
{
    "*": {
        "Magento_Catalog/js/view/minicart-open": {}
    }
}

Js में:

$(document).on('ajax:addToCart', function () {#code here...}

Answer 4

बस आप इस कोड का उपयोग अपने टेम्प्लेटिंग कोड के नीचे minicart.phtml में कर सकते हैं। मैं इस कोड का उपयोग कर रहा हूं और यह बेहतर काम कर रहा है। आप इसे आज़मा सकते हैं। धन्यवाद।

<script type="text/javascript">
    require(['jquery'], function ($) {
        $('.minicart-wrapper').on('contentLoading', function (event) {
            $('[data-block="minicart"]').on('contentUpdated', function () {
                $('[data-block="minicart"]').find('[data-role="dropdownDialog"]').dropdownDialog("open");
                setTimeout(function () {
                    $('[data-block="minicart"]').find('[data-role="dropdownDialog"]').dropdownDialog("close");
                }, 4000);
            });
        });
    });
</script>

Comments

इसके काम के लिए धन्यवाद ... मैं Magento JS flow सीखना चाहता हूँ। यह कैसे काम करता है कृपया कुछ लिंक साझा करें

— 55840

Answer 5

यह उपरोक्त उत्तर काम करता है लेकिन समापन ब्रेस गायब है:

            $('[data-block="minicart"]').on('contentLoading', function (event) {
            addToCartCalls++;
            self.isLoading(true);
                $('[data-block="minicart"]').on('contentUpdated', function ()  {
                    $('[data-block="minicart"]').find('[data-role="dropdownDialog"]').dropdownDialog("open");

                setTimeout(function() {
                $('[data-block="minicart"]').find('[data-role="dropdownDialog"]').dropdownDialog("close");
                }, 4000);
            });
        });