UMI.CMS. Добавление товара к сравнению в без перезагрузки страницы или Ajax добавление товара к сравнению

UMI.CMS. Добавление товара к сравнению в без перезагрузки страницы или Ajax добавление товара к сравнению
В данной статье я хотел бы рассказать, о том, как сделать добавление товара к сравнению при помощи jQuery Ajax в систему управления UMI.CMS.

Реализовать данную возможность достаточно просто, как оказалось =)

Сразу хочу попросить не сильно ругаться на код, так как делал в спешке, за пару часов.

Также хочу отметить, что скрипт не доработан и далее буду стараться обновлять его, по мере своей незанятости.

Итак, для того, чтобы сделать добавление товара к сравнению без перезагрузки страницы на UMI.CMS нужно сделать следующее:

Создать в папке \templates\demoold\tpls\emarket\compare файл с именем getCompareLink.tpl и добавить в него вот этот код:

<?php
$FORMS = Array();

$FORMS['add_link'] = <<<END
<a class="add_to_compare" id="%id%/" href="%add-link%">Добавить к сравнению</a>
END;
$FORMS['del_link'] = <<<END
<a class="add_to_compare" id="%id%/" href="%del-link%">Удалить из сравнения</a>
END;
?>

Хочу обратить внимание на href="%del-link%", id="%id%/" и class="add_to_compare" они должны оставаться неизменными, так как на этих атрибутах построен скрипт.

Что это такое, можете почитать вот здесь

Далее, в файле который отвечает за вывод карточки товара и за вывод товара на странице категории добавить вот эту строчку:

%emarket getCompareLink(%id%, 'getCompareLink')%

Что это такое, вы также почитать вот здесь.
Эту строчку вы скорее всего вставите в секцию(это намек, куда вставлять).

$FORMS['view_block'] = <<<END
END;

В любом случае путь к вашему шаблону будет — \templates\demoold\tpls\catalog

После того, как это будет сделано, у вас должны появится ссылки на добавление товара в избранное или удаление товара из избранного каталога UMI.CMS.

Теперь, нужно подключить jQuery, стандартная версия jQuery, которая идет в UMI.CMS подходит.

Далее скачиваете файл jquery.umi.compare.0.1.js, собственно через этот файле и происходит добавление товара в избранное через AJAX на UMI.CMS.

Скачанный файл подключаете в header или footer, не важно.

<script type="text/javascript" src="/js/jquery.umi.compare.0.1.js?%system_build%"></script>

Под ниже добавляете строчки, тут на на элемент $(«.add_to_compare») вешается функцию .umiCompare (); которая производит добавления

<script type="text/javascript">
$ = jQuery;
$(document).ready(function() {
         $(".add_to_compare").umiCompare();
})
</script>

Теперь, если у вас есть блок, в котором выводится список товара, которые сейчас в сравнении, нужно сделать так, чтобы при нажатие на ссылки товара удалялся и добавлялся к сравнению.

Открываете файл, и находите строку #45, и заменяете содержимое переменной на свое

var compare_list = '#compare-list';

В прицепе все. Теперь вы легко сможете сделать добавление товар на UMI.CMS без перезагрузки страницы.

Если вы вдруг не знаете как сделать добавление товара в корзину без перезагрузки страницы на UMI.CMS, то об этом тоже написано.

Bookmark the permalink.

Также может быть интересно:

  • Дмитрий

    Привет,а как можно это реализовать при помощи xslt ?

    • Здравствуйте, Дмитрий. Честно сказать я не знаю.

      Если у вас на выходе получается, я имею ввиду в шаблонах, html код, то да, все можно сделать. Тут все фишка в том, что мы просто посылаем запрос на уже существующую страницу, и получаем html код.

      • Дмитрий

        Все сделал ) Немножко переделал Ваш код.

        • Отлично, в прицепе там все ясно =)))

          • Sam

            Здравствуйте! Просьба поделиться кодом для xslt

    • Если реализуете, поделитесь, я с радостью обновлю статью и для xslt

  • Сергей

    Александр — Спасибо за идею! Есть желание реализовать добавление товара к сравнению, НО! Основная задача заключается в том, чтобы в блоке сравнения выводились не товары, а их количество, чтобы выглядело так: У вас 5 товаров к сравнению (+ линк на страницу сравниваемых товаров) — беда в том что макрос % total% не работает — есть ли у вас наработки похожие? пригодилось бы — заранее спасибо!!!

    • Сергей, вы знаете, я с TPL уже очень давно не работаю.

      Поэтому даже не могу вам толком ничего подсказать.

      Если вопрос будет касаться xslt, то с радостью.

      Кстати, вам также рекомендую сменить шаблонизатор. TPL очень неудобный и большие проекты на нем делать тяжело.

      • Сергей

        Готов на счет тпл поспорить )))

        • Давайте 🙂

          • Сергей

            Все оказалось еще проще — для тех кому интересно... Обычный яваскрипт с подсчетом элементов.

            $(document).ready (function (){

            var count = $('#list > li').length;

            document.getElementById ('summa').innerHTML = count;

            });

            И не забудьте скрыть от людских глаз сам