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, и заменяете содержимое переменной на свое