Удаление из корзины кнопкой (vamshop)

11.10.2017 | Написал

В вамшопе не очень удобно сделано удаление товара из корзины непосредственно на странице корзины — нужно отметить в чекбоксе товар на удаление, а потом нажать на кнопку «Пересчитать». Это не совсем понятно пользователю, и я делаю там кнопку, нажав на которую удаление происходит сразу, без других действий.
Делается это не сложно, а именно:

1. Открываем модуль содержимого корзины templates/шаблон/module/order_details.html и находим метку чекбокса удаления:

{$module_data.BOX_DELETE}

Добавляем саму кнопку из шрифта FontAwesome (если Вы не используете его в шаблоне, то просто картинку можно поставить), заворачиваем в span c классом «del» и label, в общем, вот таким образом:

<label>
<span class="del">
<i class="fa fa-times-circle"></i>{$module_data.BOX_DELETE}
</span>
</label>

2. Добавляем там же вверху или внизу небольшой js-скрипт:

{literal}
<script type="text/javascript">
$(document).ready( function() {
$('#cart_quantity :checkbox').click(function() {
  $('#cart_quantity').submit();
});
$('#cart_quantity .table-num').find('input').change(function() {
	$('#cart_quantity').submit();
});
});
function doClear(theText) { if (theText.value == theText.defaultValue) { theText.value = "" } }
function doDefault(theText) { if (theText.value == "") { theText.value = theText.defaultValue } }	
</script>
{/literal}

3. В файл стилей stylesheet.css добавляем:

.del {display: block;text-decoration: none !important;width:23px;height:23px;margin:0;color:#f33; font-size:18px; line-height:20px; cursor:pointer;}
.del input {opacity: 0;-moz-opacity: 0;-khtml-opacity: 0;cursor: pointer;filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);width:0;height:0;}

Тем самым мы скрываем чекбокс и немного стилизуем кнопку.

Все, после этого удаление из корзины будет происходить по нажатию на крестик.

Метки: ,
1 комментарий читателей статьи "Удаление из корзины кнопкой (vamshop)"
  • Андрей пишет:

    Для VamShop очень нужная фича! Автору спасибо!

Добавить комментарий

Ваш e-mail не будет опубликован.