Всем привет.
Вообщем натягиваю html шаблон на opencart и столкнулся с необходимостью во всплывающей корзине добавить + - а и обновить стоимость.
Решил взять решение из common,js (ajax обновление корзины) но оно почему то не работает.
В js я новичок потому и не знаю как на чистом js это выполнить попроще.
Буду благодалрен подсказкам.
<div class="shop-counter">
<div class="custom-input-number">
<button type="button" class="cin-btn cin-decrement">
<img src="img/left_arr.png" alt=""></button>
<input type="number" name="quantity[<?php echo $product['cart_id']; ?>]" class="cin-input input-field quant" value="<?php echo $product['quantity']; ?>" >
<button type="button" class="cin-btn cin-increment"><img src="img/right_arr.png" alt=""></button>
</div>
</div>
<script type="text/javascript" >
$(document).ready(function() {
$('.cin-decrement').click(function () {
var $input = $(this).parent().find('.quant');
var count = parseInt($input.val()) - 1;
count = count < 1 ? 1 : count;
$input.val(count);
$input.change().edit();
$.ajax({
url: 'index.php?route=checkout/cart/edit',
type: 'post',
data: 'key=' + key + '&quantity=' + (typeof(quantity) != 'undefined' ? quantity : 1),
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 total
setTimeout(function () {
$('#cart > .shop-card-item > button').html('<div class="shop-icon"> <img src="/image/catalog/cart.svg"><div class="shop-number">' + json['total'] + '</div></div>');
}, 100);
if (getURLVar('route') == 'checkout/cart' || getURLVar('route') == 'checkout/checkout') {
location = 'index.php?route=checkout/cart';
} else {
$('#cart .shop-card-list').load('index.php?route=common/cart/info ul li');
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
return false;
});
$('.cin-increment').click(function () {
var $input = $(this).parent().find('.quant');
$input.val(parseInt($input.val()) + 1);
$input.change().edit();
$.ajax({
url: 'index.php?route=checkout/cart/edit',
type: 'post',
data: 'key=' + key + '&quantity=' + (typeof(quantity) != 'undefined' ? quantity : 1),
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 total
setTimeout(function () {
$('#cart > .shop-card-item > button').html('<div class="shop-icon"> <img src="/image/catalog/cart.svg"><div class="shop-number">' + json['total'] + '</div></div>');
}, 100);
if (getURLVar('route') == 'checkout/cart' || getURLVar('route') == 'checkout/checkout') {
location = 'index.php?route=checkout/cart';
} else {
$('#cart .shop-card-list').load('index.php?route=common/cart/info ul li');
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
return false;
});
});