Удаление из корзины кнопкой (vamshop)
В вамшопе не очень удобно сделано удаление товара из корзины непосредственно на странице корзины – нужно отметить в чекбоксе товар на удаление, а потом нажать на кнопку “Пересчитать”. Это не совсем понятно пользователю, и я делаю там кнопку, нажав на которую удаление происходит сразу, без других действий.
Делается это не сложно, а именно:
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;} |
Тем самым мы скрываем чекбокс и немного стилизуем кнопку.
Все, после этого удаление из корзины будет происходить по нажатию на крестик.
-
Андрей пишет:
Для VamShop очень нужная фича! Автору спасибо!