Add 'plus' 'minus' In Place Of 'add To Cart' In Opencart

I want to replace add to cart with 2 buttons that are plus and minus in OpenCart 2.0.1.1, Now i am unable to code for minus button properly. I have added plus and mius button in ca

Solution 1:

In order to decrement your product quantity you need product_id and its quantity. To decrement we need to check whether qty is greater than 1 or not if it is then we can decrement else we need to remove entire product if qty is only 1.

Things you need to change is your view page add plus , minus icons there, then controller then library then send ajax result back. I will try to make this as easier as possible.

Lets start with view page in my case it is products.tpl the code i writteb to get plus minus buttons is

<tableclass="table scroll"><tbody><?phpforeach ($productsas$product) { ?><tr ><td ><inputtype="text"style="width: 20px; height: 20px;font-weight:700 "disabled="true"value="<?phpecho$product['quantity']; ?>"class="text-center"></td><tdclass="text-left"><ahref="<?phpecho$product['href']; ?>"><b><?phpecho$product['name']; ?></b></a></td><tdstyle=" text-align:right"><iclass="fa fa-minus-circle fa-2x"style="cursor: pointer;color:red;"onclick="cart.remove('<?phpecho$product['key']; ?>');"></i></td></tr><tr><tdcolspan="2"style="border:0 none;"><divclass="btn-group form-inline"role="group"><buttontype="button"style="height:25px;width:25px"class="btn btn-default btn-xs "onclick="cart.decrement('<?phpecho$product['product_id']; ?>');"><iclass="fa fa-minus"></i></button><buttontype="button"style="height:25px;width:25px"class="btn btn-default btn-xs"onclick="cart.add('<?phpecho$product['product_id']; ?>');"><iclass="fa fa-plus"></i></button></div></td><tdstyle="border:0 none;"class="text-right" ><b><?phpecho$product['total']; ?></b></td></tr><?php } ?>

Here I have made javascript ajax call onclick. So lets see what that call does. I have written in same page you can write in any .js file if you wish. script.js

'decrement': function(key) {
$.ajax({
url: 'index.php?route=checkout/cart/decrement',
type: 'post',
data: 'key=' + key,
dataType: 'json',
beforeSend: function() {
$('#cart > button').button('loading');
},
complete: function() {
$('#cart > button').button('reset');
},
success: function(json) {
// Need to set timeout otherwise it wont update the totalsetTimeout(function () {
$('#cart > button').html('<span id="cart-total"><i class="fa fa-shopping-cart"></i> ' + json['total'] + '</span>');
}, 100);

if (getURLVar('route') == 'checkout/cart' || getURLVar('route') == 'checkout/checkout') {
location = 'index.php?route=checkout/cart';
} else {
$('#cart > ul').load('index.php?route=common/cart/info ul li');
}
}
});
}

Now the url we calling from above ajax call is the path for our controller checkout and function decrement. Here is that

controller.php

publicfunctiondecrement() {
    $this->load->language('checkout/cart');

    $json = array();

    // Removeif (isset($this->request->post['key'])) {
    $this->cart->decrement_product_quantity($this->request->post['key'],1);

    unset($this->session->data['vouchers'][$this->request->post['key']]);

    $this->session->data['success'] = $this->language->get('text_remove');
  // rest of the code keep same}

Now did you noticed we are calling library function decrement_product_quantity by passing qty and 1. Here key is nothing but ajax parameter which is product_id.

Now final function in library

publicfunctiondecrement_product_quantity($product_id, $qty = 1){
$this->data = array();
$product['product_id'] = (int)$product_id;
$key = base64_encode(serialize($product));

if ((int)$qty && ((int)$qty > 0)) {
if ($this->session->data['cart'][$key]>1) {
$this->session->data['cart'][$key] -= (int)$qty;
} else {
$this->remove($key);
}
}
}

This one checks cart if qty is greater than 1 it will decrement else remove the entire product. Hope you understood please let me know if any queries you have. Also hope you can do for increment too. good luck

Solution 2:

The problem here is with standard opencart since 2.0 that post fields with an index longer than 64 characters are ignored (on some systems, at least for my customer).

So if you have a product without options than the field quantity[index] is received by a post request because the index is lesser than 64 characters.But if the product have an option, than the index is greater than 64 characters and the field is not received in a post request (via ajax or not).

The provider from my customer don't want to change this on a shared server, my solution is look how it works in an older version of opencart (I think it is only used in the program /system/library/cart.php) and take it over in 2.0 and your problem have solved .. the index is shorter in older versions .. because not all fields have used for base64_encode ..

Look in the html code of your shopping cart and find the field quantity[..] and count the characters of your index .. for me when longer than 64 characters (e.g. product option used) the field is not received anymore in a post request (via ajax or not) ..

Maybe when you have an own server, you don't have this problem ..