ম্যাজেন্টো 2-তে পণ্য উইজেটের 'অ্যাড টু কার্ট' বোতামের জন্য কীভাবে এজেএক্স সক্ষম করবেন?


10

ম্যাজেন্টো 2-এ স্বাভাবিক Add to Cartবোতামটিতে কার্টে পণ্য যুক্ত করার জন্য খুব সুন্দর AJAX- ভিত্তিক যুক্তি রয়েছে।
তবে, যখন আমরা Catalog Products Listসিএমএস পৃষ্ঠাগুলিতে উদাহরণস্বরূপ কোনও উইজেট ব্যবহার করি তখন এই পণ্য তালিকার বোতামটি HTTP POSTবর্তমান পৃষ্ঠাটি পুনরায় লোড করে এমন একটির সাথে কাজ করে ।

ব্যবহারকারীর অভিজ্ঞতা এ থেকে ভোগা হয় এবং এটি বাঞ্ছনীয় যদি বোতামটির ডিফল্ট বিভাগের পণ্য তালিকায় বা পণ্য পৃষ্ঠাগুলির মতো একই এজেএক্স যুক্তি থাকে।

আমরা কীভাবে Catalog Products Listউইজেটটি প্রসারিত করতে পারি যাতে এটি আরও ভাল Add to Cart বোতামটি ব্যবহার করে ? বা অন্য কোন কাজ আছে?


আমি বিশ্বাস করি আপনি "সিএমএস পৃষ্ঠাগুলি" বলতে চেয়েছিলেন, "সিএসএস পৃষ্ঠাগুলিতে" নয়। :)
Iveta Allogenes

@ ইভেটাআলোজেনেস সম্পাদিত ;-)
জে ডিওয়ার্ক

উত্তর:


22

আপনাকে addtocart.phtml ফাইলটি ওভাররাইড করতে হবে

app/design/frontend/vendorname/themename/Magento_Catalog/templates/product/view/addtocart.phtml

এখন শুধু প্রতিস্থাপন "bindSubmit": মিথ্যা থেকে "bindSubmit": TRUE

<script type="text/x-magento-init">
    {
        "#product_addtocart_form": {
            "catalogAddToCart": {
                "bindSubmit": false
            }
        }
    }
</script>

প্রতি

<script type="text/x-magento-init">
    {
        "#product_addtocart_form": {
            "catalogAddToCart": {
                "bindSubmit": true
            }
        }
    }
</script>

এখন ক্যাশে এবং পেজ_ক্যাশ ফোল্ডার বা ফ্লাশ ক্যাশে মুছুন।

দ্রষ্টব্য: আপনার কোনও নম্বর সেট করতে হবে তা নিশ্চিত করুন Store->Configuration->Sales->Checkout->Shopping Cart->After Adding a Product Redirect to Shopping Cart to No


এই কোডটি ম্যাজেন্টো ২.২.৩ এ কাজ করছে না।
আশনা

২.২.৩ এ হোম পেজ উইজেটের জন্য গ্রিডে html এ কার্টে আমরা কীভাবে অ্যাজ্যাক্স যুক্ত করতে পারি
আশনা

@ প্রিন্স প্যাটেল, কীভাবে এটি আবার যুক্ত করা যায়? আমি
এজাক্স

@ জাফরপিনজার এটি ডিফল্ট ম্যাজেন্টো কোড। ইস্যুটির জন্য দয়া করে এজাক্স স্ক্রোল মডিউলটি দেখুন।
প্রিন্স প্যাটেল

এই "বাইন্ড সাবমিট" দিয়ে এই ফাইলে পরিবর্তনের পরে এটি আমার পক্ষে কাজ করছে: সত্য
সরফরাজ সিপাই

6

আপনি Catalog Products Listনিম্নলিখিত ফাইলগুলির সাথে একটি মডিউল তৈরি করে এজাক্স কার্টটি ব্যবহার করতে প্রসারিত করতে পারেন:

/ আপনার / মডেল / ব্লক / প্রোডাক্ট / লিস্টব্লক.এফপি সামগ্রী সহ:

<?php

namespace Your\Module\Block\Product;


use Magento\CatalogWidget\Block\Product\ProductsList;

class ListBlock extends ProductsList
{
    /**
     * @var \Magento\Framework\Url\Helper\Data
     */
    protected $urlHelper;

    public function __construct(
        \Magento\Catalog\Block\Product\Context $context,
        \Magento\Catalog\Model\ResourceModel\Product\CollectionFactory $productCollectionFactory,
        \Magento\Catalog\Model\Product\Visibility $catalogProductVisibility,
        \Magento\Framework\App\Http\Context $httpContext,
        \Magento\Rule\Model\Condition\Sql\Builder $sqlBuilder,
        \Magento\CatalogWidget\Model\Rule $rule,
        \Magento\Widget\Helper\Conditions $conditionsHelper,
        \Magento\Framework\Url\Helper\Data $urlHelper,
        array $data
    )
    {
        $this->urlHelper = $urlHelper;

        parent::__construct($context, $productCollectionFactory, $catalogProductVisibility, $httpContext, $sqlBuilder, $rule, $conditionsHelper, $data);
    }

    /**
     * Get post parameters
     *
     * @param \Magento\Catalog\Model\Product $product
     * @return string
     */
    public function getAddToCartPostParams(\Magento\Catalog\Model\Product $product)
    {
        $url = $this->getAddToCartUrl($product);
        return [
            'action' => $url,
            'data' => [
                'product' => $product->getEntityId(),
                \Magento\Framework\App\ActionInterface::PARAM_NAME_URL_ENCODED =>
                    $this->urlHelper->getEncodedUrl($url),
            ]
        ];
    }
}

আপনার / মডিউল / ইত্যাদি / উইজেট.এক্সএমএল সামগ্রী সহ:

<widgets xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Widget:etc/widget.xsd">
    <widget id="ajax_products_list" class="Your\Module\Block\Product\ListBlock" is_email_compatible="true"
            placeholder_image="Magento_CatalogWidget::images/products_list.png" ttl="86400">
        <label translate="true">Ajax Catalog Products List</label>
        <description translate="true">List of Products with Ajax Cart</description>
        <parameters>
            <parameter name="title" xsi:type="text" required="false" visible="true">
                <label translate="true">Title</label>
            </parameter>
            <parameter name="show_pager" xsi:type="select" visible="true"
                       source_model="Magento\Config\Model\Config\Source\Yesno">
                <label translate="true">Display Page Control</label>
            </parameter>
            <parameter name="products_per_page" xsi:type="text" required="true" visible="true">
                <label translate="true">Number of Products per Page</label>
                <depends>
                    <parameter name="show_pager" value="1" />
                </depends>
                <value>5</value>
            </parameter>
            <parameter name="products_count" xsi:type="text" required="true" visible="true">
                <label translate="true">Number of Products to Display</label>
                <value>10</value>
            </parameter>
            <parameter name="template" xsi:type="select" required="true" visible="true">
                <label translate="true">Template</label>
                <options>
                    <option name="default" value="Your_Module::product/widget/content/grid.phtml" selected="true">
                        <label translate="true">Products Grid Template</label>
                    </option>
                </options>
            </parameter>
            <parameter name="cache_lifetime" xsi:type="text" visible="true">
                <label translate="true">Cache Lifetime (Seconds)</label>
                <description translate="true">86400 by default, if not set. To refresh instantly, clear the Blocks HTML Output cache.</description>
            </parameter>
            <parameter name="condition" xsi:type="conditions" visible="true" required="true" sort_order="10"
                       class="Magento\CatalogWidget\Block\Product\Widget\Conditions">
                <label translate="true">Conditions</label>
            </parameter>
        </parameters>
        <containers>
            <container name="content">
                <template name="grid" value="default" />
            </container>
            <container name="content.top">
                <template name="grid" value="default" />
            </container>
            <container name="content.bottom">
                <template name="grid" value="default" />
            </container>
        </containers>
    </widget>
</widgets>

এবং পরিশেষে আপনার / মডিউল / দর্শন / সম্মুখভাগ / টেমপ্লেটগুলি / পণ্য / উইজেট / সামগ্রী / গ্রিড.পিটিএমএল সামগ্রী সহ:

<?php

// @codingStandardsIgnoreFile
use Magento\Framework\App\Action\Action;
?>
<?php
/**
 * Template for displaying products list widget
 *
 * @var $block \Your\Module\Block\Product\ListBlock
 */
?>
<?php if ($exist = ($block->getProductCollection() && $block->getProductCollection()->getSize())):?>
<?php
    $type = 'widget-product-grid';

    $mode = 'grid';

    $image = 'new_products_content_widget_grid';
    $title = $block->getTitle() ? __($block->getTitle()) : '';
    $products = $block->getProductCollection()->getItems();
    $_helper = $this->helper('Magento\Catalog\Helper\Output');

    $showWishlist = true;
    $showCompare = true;
    $showCart = true;
    $templateType = \Magento\Catalog\Block\Product\ReviewRendererInterface::DEFAULT_VIEW;
    $showDescription = false;
?>
    <div class="block widget block-products-list <?php /* @escapeNotVerified */ echo $mode; ?>">
        <?php if ($title):?>
        <div class="block-title">
            <strong><?php /* @escapeNotVerified */ echo $title; ?></strong>
        </div>
        <?php endif ?>
        <div class="block-content">
            <?php /* @escapeNotVerified */ echo '<!-- ' . $image . '-->' ?>
            <div class="products-<?php /* @escapeNotVerified */ echo $mode; ?> <?php /* @escapeNotVerified */ echo $mode; ?>">
                <ol class="product-items <?php /* @escapeNotVerified */ echo $type; ?>">
                    <?php $iterator = 1; ?>
                    <?php /** @var \Magento\Catalog\Model\Product $_product */ ?>
                    <?php foreach ($products as $_product): ?>
                        <?php /* @escapeNotVerified */ echo($iterator++ == 1) ? '<li class="product-item">' : '</li><li class="product-item">' ?>
                        <div class="product-item-info" data-container="product-grid">
                            <?php
                            $productImage = $block->getImage($_product, $image);
                            ?>
                            <?php // Product Image ?>
                            <a href="<?php /* @escapeNotVerified */ echo $_product->getProductUrl() ?>" class="product photo product-item-photo" tabindex="-1">
                                <?php echo $productImage->toHtml(); ?>
                            </a>
                            <div class="product details product-item-details">
                                <?php
                                $_productNameStripped = $block->stripTags($_product->getName(), null, true);
                                ?>
                                <strong class="product name product-item-name">
                                    <a class="product-item-link"
                                       href="<?php /* @escapeNotVerified */ echo $_product->getProductUrl() ?>">
                                        <?php /* @escapeNotVerified */ echo $_helper->productAttribute($_product, $_product->getName(), 'name'); ?>
                                    </a>
                                </strong>
                                <?php echo $block->getReviewsSummaryHtml($_product, $templateType); ?>
                                <?php /* @escapeNotVerified */ echo $block->getProductPrice($_product) ?>
                                <?php echo $block->getProductDetailsHtml($_product); ?>

                                <div class="product-item-inner">
                                    <div class="product actions product-item-actions">
                                        <div class="actions-primary">
                                            <?php if ($_product->isSaleable()): ?>
                                                <?php $postParams = $block->getAddToCartPostParams($_product); ?>
                                                <form data-role="tocart-form" action="<?php /* @escapeNotVerified */ echo $postParams['action']; ?>" method="post">
                                                    <input type="hidden" name="product" value="<?php /* @escapeNotVerified */ echo $postParams['data']['product']; ?>">
                                                    <input type="hidden" name="<?php /* @escapeNotVerified */ echo Action::PARAM_NAME_URL_ENCODED; ?>" value="<?php /* @escapeNotVerified */ echo $postParams['data'][Action::PARAM_NAME_URL_ENCODED]; ?>">
                                                    <?php echo $block->getBlockHtml('formkey')?>
                                                    <button type="submit"
                                                            title="<?php echo $block->escapeHtml(__('Add to Cart')); ?>"
                                                            class="action tocart primary">
                                                        <span><?php /* @escapeNotVerified */ echo __('Add to Cart') ?></span>
                                                    </button>
                                                </form>
                                            <?php else: ?>
                                                <?php if ($_product->getIsSalable()): ?>
                                                    <div class="stock available"><span><?php /* @escapeNotVerified */ echo __('In stock') ?></span></div>
                                                <?php else: ?>
                                                    <div class="stock unavailable"><span><?php /* @escapeNotVerified */ echo __('Out of stock') ?></span></div>
                                                <?php endif; ?>
                                            <?php endif; ?>
                                        </div>
                                        <div data-role="add-to-links" class="actions-secondary">
                                            <?php if ($this->helper('Magento\Wishlist\Helper\Data')->isAllow()): ?>
                                                <a href="#"
                                                   class="action towishlist"
                                                   title="<?php echo $block->escapeHtml(__('Add to Wish List')); ?>"
                                                   aria-label="<?php echo $block->escapeHtml(__('Add to Wish List')); ?>"
                                                   data-post='<?php /* @escapeNotVerified */ echo $block->getAddToWishlistParams($_product); ?>'
                                                   data-action="add-to-wishlist"
                                                   role="button">
                                                    <span><?php /* @escapeNotVerified */ echo __('Add to Wish List') ?></span>
                                                </a>
                                            <?php endif; ?>
                                            <?php
                                            $compareHelper = $this->helper('Magento\Catalog\Helper\Product\Compare');
                                            ?>
                                            <a href="#"
                                               class="action tocompare"
                                               title="<?php echo $block->escapeHtml(__('Add to Compare')); ?>"
                                               aria-label="<?php echo $block->escapeHtml(__('Add to Compare')); ?>"
                                               data-post='<?php /* @escapeNotVerified */ echo $compareHelper->getPostDataParams($_product); ?>'
                                               role="button">
                                                <span><?php /* @escapeNotVerified */ echo __('Add to Compare') ?></span>
                                            </a>
                                        </div>
                                    </div>
                                    <?php if ($showDescription):?>
                                        <div class="product description product-item-description">
                                            <?php /* @escapeNotVerified */ echo $_helper->productAttribute($_product, $_product->getShortDescription(), 'short_description') ?>
                                            <a href="<?php /* @escapeNotVerified */ echo $_product->getProductUrl() ?>" title="<?php /* @escapeNotVerified */ echo $_productNameStripped ?>"
                                               class="action more"><?php /* @escapeNotVerified */ echo __('Learn More') ?></a>
                                        </div>
                                    <?php endif; ?>
                                </div>
                            </div>
                        </div>
                        <?php echo($iterator == count($products)+1) ? '</li>' : '' ?>
                    <?php endforeach ?>
                </ol>
            </div>
            <?php echo $block->getPagerHtml() ?>
        </div>
    </div>
    <?php if (!$block->isRedirectToCartEnabled()) : ?>
        <script type="text/x-magento-init">
        {
            "[data-role=tocart-form], .form.map.checkout": {
                "catalogAddToCart": {}
            }
        }
        </script>
    <?php endif; ?>
<?php endif;?>

নিশ্চিত হন এবং আপনার নিজের নামের সাথে 'আপনার \ মডিউল' এর সমস্ত দৃষ্টান্ত প্রতিস্থাপন করুন।


1
আপনি পিটিএইচটিএমএল ফিলে কী পরিবর্তন করেছেন তা নিশ্চিত নন। আপনি কী বদলেছেন এবং কেন (অন্যান্য
ফাইলগুলি

2

ম্যাজেন্টো ২.২-তে Magento_Catalog/product/view/validationস্ক্রিপ্টটির পরিবর্তে কল করা হয় catalogAddToCart

এটি ইতিমধ্যে উপস্থিত রয়েছে addtocart.phtml( radioCheckboxClosestকনফিগার বিকল্পের সাথে), সুতরাং এজ্যাক্ট কার্টে যুক্ত করতে কেবল এই bindSubmitবিকল্পটি যুক্ত করুন :

<script type="text/x-magento-init">
{
    "#product_addtocart_form": {
        "Magento_Catalog/product/view/validation": {
            "bindSubmit": true,
            "radioCheckboxClosest": ".nested"
        }
    }
}
</script>

এই সেটিংটি যুক্ত করা আমার পক্ষে কাজ করে না
জোশুয়া বন্যা

V2.2.3 এ ত্রুটিহীনভাবে কাজ করেছেন, আপনাকে ধন্যবাদ!
ক্রিস্টজান ও।

1

সর্বশেষতম ম্যাজেন্টো 2 প্রকাশে এটি আবার পরিবর্তন করা হয়েছিল এবং এটি এখন

<script type="text/x-magento-init">
    {
        "#product_addtocart_form": {
            "Magento_Catalog/js/validate-product": {
                "bindSubmit": true
            }
        }
    }
</script>

1

ম্যাজেন্টো ২.৩ এর সমাধান

উইজেট ক্যাটালগ পণ্য তালিকার জন্য:

আপনার এই ক্ষেত্রে উইজেটের টেমপ্লেটটি খুঁজে পাওয়া উচিত

মডিউল-ক্যাটালগ-উইজেট / দৃশ্য / ফ্রন্টএন্ড / টেমপ্লেট / পণ্য / উইজেট / বিষয়বস্তু / grid.phtml

এবং এই কোডটি সন্নিবেশ করান:

<script type="text/x-magento-init">
    {
        "[data-role=tocart-form], .form.map.checkout": {
            "catalogAddToCart": {}
        }
    }
</script>

এটা ঠিক কাজ করে। ধন্যবাদ।
আজি
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.