CODEWITHSUNDEEP
opencartproduct
lopiar
lopiar

Reputation: 27

Opencart: How do I add the same product to the cart twice with different options?

I am trying to get this to work for some time now.

My products are contact lenses and when you want to order you need to fill some Options like Radius, Thickness, Diopter etc. twice (left eye and right eye).

I want when I press Add to cart, to add the same product twice in the cart (the first with the Options for the left eye and the second with the Options for the right eye).

Is this possible in Opencart?

Upvotes: 1

Views: 1374

Answers (1)

Paul Gregory
Paul Gregory

Reputation: 1753

Basically, you want (for certain products) to show all the product info and options twice on screen, and have both sets added to cart when you click Add To Cart, so they appear as separate products.

Repeating the options under certain conditions is fairly trivial.

Sadly however, OpenCart's Add To Cart expects just one set of product data. It expects this in four places:

  • the jQuery script that submits your options via Ajax
  • the routine that actually adds the product from the Ajax submission
  • the routine that adds the product from a standard form submission
  • the routine that says "Success! You added Bongo Contact Lens to your cart!"

Even then, within the code that adds the product there is the assumption of one set of product options.

There's quite a lot of code that could need changing - and stuff that you don't generally want to be messing with.

But there is a way.

Let us assume you don't want to mess with index.php?route=checkout/cart/add and want to keep your code within the product.tpl template and JavaScript.

What you will first need to do is wrap the product inputs (including hidden inputs) in a div with a unique class, say .lens-left, and use that class name in place of every instance of .product-info in the line:

data: $('.product-info input[type=\'text\'], .product-info input[type=\'hidden\'], .product-info input[type=\'radio\']:checked, .product-info input[type=\'checkbox\']:checked, .product-info select, .product-info textarea'),

Next, write some JS that is fired on relevant product pages on load and:

  1. Adds a new div with class lens-right and copies the contents of lens-left into it.
  2. Binds to the cart button a second Ajax call that is an exact copy of the standard one but uses the class name of the second set.

With all this in place, clicking Add To Cart will add the first product to cart, then add the second product to cart. Doing this in sequence rather than together means that you're only passing one set of data through at a time. Using JS to add the second set means that users without JS don't see it.

This could be improved further by making the on-load JS instead add a button that says "My left and right eyes need different lenses", which would then fire all the other stuff.

Upvotes: 1

Related Questions