On the category page, add multiple products to the shopping cart at a time !!

Source: Internet
Author: User
How to simultaneously add multiple products to a magento shopping cart

 

 

In the past, the list in list. phtml can be executed and cannot be added to the grid !!

Address: http://www.lindenlan.net/2009/09/27/how-to-simultaneously-add-multiple-products-to-a-magento-shopping-cart/

 

 

Posted September 27 th, 2009

In programming

This post is a bit overdue considering the project
Which I did this was completed months ago. I finally got around
Documenting it. magento's product list view lets MERs add
Products to the shopping cart one at a time. The client wanted
Customers to be able to add multiple products to the shopping cart
Simultaneously. Given the time constraints for the projects, I
Created an ad hoc Ajax
Method To accomplish this feature request.

 

Adding a product to a magento (ver. 1.3.1) shopping cart is accomplished through an HTTP
Get
Request. It will look like or similar to this:

/path/to/app/checkout/cart/add?product=[id]&qty=[qty]

That URL
Is output by the template helper:

$this->getAddToCartUrl($_product)

Since adding a product to the shopping cart is nothing more than a get
Request, then all that needs to be done is queue up the URLs of
Desired products, make each request in order, and then reload the page
When done.

First, in APP/design/frontend/
/
/Template/CATALOG/product/list.html, I first added checkboxes
Allow customers to select which products they want and also hidden
Fields for storing the URLs to add the product and text fields for
Quantity.

<input type="checkbox" class="input-checkbox add" name="add_<?php echo $_iterator; ?>" id="add_<?php echo $_iterator; ?>" /><input type="hidden" name="url_<?php echo $_iterator; ?>" id="url_<?php echo $_iterator; ?>" value="<?php echo $this->getAddToCartUrl($_product) ?>" /><?php if(!$_product->isGrouped()): ?>     <input type="text" class="input-text qty" name="qty_<?php echo $_iterator; ?>" id="qty_<?php echo $_iterator; ?>" maxlength="12" value="<?php echo $this->getMinimalQty($_product) ?>" /><?php endif; ?>

I added this code within the loop that generate the html
For the product line items for the list. Next, I added the Javascript
That does the actual processing, also within the list section right
After the script block that contains:decorateList('products-list', 'none-recursive')
.

<script type="text/javascript">    function processNext(urls, i) {        var next = i + 1;        $('processing-text').update('Processing item ' + next);        if (next < urls.size()) {            new Ajax.Request(urls[i], {              method: 'get',              onComplete: function(transport) {                processNext(urls, next);              }            });        } else {            new Ajax.Request(urls[i], {              method: 'get',              onComplete: function(transport) {                window.location.reload();              }            });        }    }    function addItemsToCart() {        $('add-items-to-cart').hide();        $('waiting').show();        var addToCartUrls = [];        $$('input.add').each(function(e){            if(e.checked == true) {                var id = e.readAttribute('id').split('_')[1];                var qty = Number($('qty_' + id).value);                if (qty < 1) qty = 1;                addToCartUrls.push($('url_' + id).value + 'qty/' + qty);            }        });        if (addToCartUrls.size() > 0) {            processNext(addToCartUrls, 0);        } else {            $('add-items-to-cart').show();            $('waiting').hide();            alert('Please check off the items you want to add.');        }    }</script>

At the bottom of the list I added a submit button.

<div style="margin-bottom:5px; text-align:right;"><button id="add-items-to-cart" class="form-button" onclick="addItemsToCart()"><span><?php echo $this->__('Add Items to Cart') ?></span></button><div id="waiting" style="height:22px; display:none; line-height:22px;"><span id="processing-text">Processing...</span> getSkinUrl().'images/wait22trans.gif'; ?>" width="22" height="22" style="display:inline; vertical-align:middle;"/></div></div>

Clicking the button callthe FunctionaddItemsToCart()
.
The function hides the button to prevent a double click and
Unhides the status message. Next, the function determines which
Checkboxes are checked. For each checked checkbox, the function
Finds the corresponding URL
Field and quantity field, Concatenates the two values, and stores the new URL
In an array. If the length of the array is greater than 0, then the function CILSprocessNext()
, Otherwise it displays an error message and resets the submit button.

The FunctionprocessNext()
First updates the processing message. The function takes the array of URLs and an index, and then creates an Ajax
Get
Request using the URL
At the given index in the array. If the Ajax
Request completes, it callprocessnext () with the same array
With an incremented index while the index is less than the Array
Length. If the incremented index is greater than the array length,
Then that ends the processing and the function reloads the page.

That's it. If there is anything wrong with the code, it assumes that all the get
Requests will complete. Unfortunately, given the time constraints there was no time to account for the scenario where a get
Request fails.

Sharethis

6 responses to "How to simultaneously add multiple products to a magento shopping cart"
  1. Benabbas Amine
    Said on September 8th, 2010 at pm:

    Nice work, but when we click on add items to cart, they are going
    To recently viewed products instead .... Any idea about this, have you
    Updated your codes...

    Thanks

  2. Brian
    Said on September 8th, 2010 at pm:

    I have no idea. I have not updated the code for the latest version of magento.

  3. Erin
    Said on December 8th, 2010 at 8:13 am:

    Hi Brian,

    Thank you for this post. I know this is a little off topic but-do
    You have any idea how to implement this idea for the product compare
    Function rather than the cart? I. e. If I have multiple products
    Listed, I wowould like to check off the ones I want to compare and click
    "Compare products" and have all the products I checked off added
    The Compare popup?

    Thank you!

    Erin

  4. Brian
    Said on December 8th, 2010 at pm:

    @ Erin

    Unfortunately, I'm not familiar with the product compare function and so I don't know if this technique is applicable.

  5. Webbon
    Said on March 2nd, 2011 at 8:56 am:

    Hello.
    I'm trying to get it to work on the custom template, where I show all
    Items from all categories by using the getitems () as $
    _ Product):?>
    Script Processing checked items but does not save the products in cart, the page just restarts.

    This is my code:
    Helper ('catalog/output ');
    $ Product = Mage: GetModel ('catalog/product ');
    $ Productname collection = $ product-> getcollection ()-> addattributetoselect ('*');
    $ _ Product = $ this-> getproduct ();
    ?>
    Getitems () as $ _ product):?>
    <A href = "getproducturl ()?>"> Getname ()?>
    <A href = "getproducturl ()?>"> Getsku ()?>
    Getprice ()?>

  6. CodeRed
    Said on March 2nd, 2011 at pm:

    Hi! How about update script to use with magento 1.5.0.1 there addtocartlink looks like/Checkout/cart/Add/product/25/qty/3

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.