Работа с корзиной без перезагрузки TPL — различия между версиями
Alexei (обсуждение | вклад) |
|||
| (не показана 1 промежуточная версия 1 участника) | |||
| Строка 1: | Строка 1: | ||
'''Проверенно на версии системы 2.9 редакция 21905''' | '''Проверенно на версии системы 2.9 редакция 21905''' | ||
| − | Самый простой и удобный способ реализовать данную задачу заключается в том, что нужно использовать уже имеющиеся в UMI.CMS скрипты из тестового демосайта | + | Самый простой и удобный способ реализовать данную задачу заключается в том, что нужно использовать уже имеющиеся в UMI.CMS скрипты из тестового демосайта Demodizzy (шаблон современный). Для этого вам нужно установить локальную версию с данным шаблоном и скопировать файлы '''"__common.js"''' и '''"basket.js"''' из папки ''~/templates/demodizzy/js/'' в свою систему. За добавление товара в корзину отвечают методы '''site.basket.add''' и '''basket.putElement''' из файла: '''"basket.js"''' |
| − | После того как мы перенесли файлы на сайт с TPL шаблонизатором, необходимо отредактировать метод '''site.utils.js.init''' в файле '''"__common.js"'''. В этом методе подключается файл '''" | + | После того как мы перенесли файлы на сайт с TPL шаблонизатором, необходимо отредактировать метод '''site.utils.js.init''' в файле '''"__common.js"'''. В этом методе подключается файл '''"basket.js"''' и поэтому необходимо изменить адрес этого файла в соответствии с тем куда Вы его перенесли. В нашем случае после редактирования метод будет выглядеть так: |
<source lang="javascript"> | <source lang="javascript"> | ||
| Строка 15: | Строка 15: | ||
Пример: | Пример: | ||
| − | <source lang="html4strict"> | + | <source lang="html4strict"> |
| + | <script type="text/javascript" src="/js/jquery/jquery.js"></script> | ||
<script type="text/javascript" src="/templates/demoold/js/__common.js"></script> | <script type="text/javascript" src="/templates/demoold/js/__common.js"></script> | ||
</source> | </source> | ||
| Строка 21: | Строка 22: | ||
После того как фал подключен в шаблонах дизайна — нужно соответствующим образом модифицировать ссылку каталога на добавление товара. | После того как фал подключен в шаблонах дизайна — нужно соответствующим образом модифицировать ссылку каталога на добавление товара. | ||
| − | Данная ссылка описана в tpl шаблоне: ''~\tpls\ | + | Данная ссылка описана в tpl шаблоне: ''~\tpls\emarket\default.tpl'' в блоке '''$FORMS['basket_add_link']'''. |
Скрипт работает таким образом, что ищет необходимый элемент по ID и классу ссылки. По этому ссылка на добавление товара должна иметь следующий вид (если не модифицировать сам скрипт): | Скрипт работает таким образом, что ищет необходимый элемент по ID и классу ссылки. По этому ссылка на добавление товара должна иметь следующий вид (если не модифицировать сам скрипт): | ||
<source lang="html4strict"> | <source lang="html4strict"> | ||
$FORMS['basket_add_link'] = <<<END | $FORMS['basket_add_link'] = <<<END | ||
| − | <a id="add_basket_%id%" class="basket_list">Положить в корзину</a> | + | <a href="#" id="add_basket_%id%" class="basket_list">Положить в корзину</a> |
END; | END; | ||
</source> | </source> | ||
Текущая версия на 13:33, 12 ноября 2015
Проверенно на версии системы 2.9 редакция 21905
Самый простой и удобный способ реализовать данную задачу заключается в том, что нужно использовать уже имеющиеся в UMI.CMS скрипты из тестового демосайта Demodizzy (шаблон современный). Для этого вам нужно установить локальную версию с данным шаблоном и скопировать файлы "__common.js" и "basket.js" из папки ~/templates/demodizzy/js/ в свою систему. За добавление товара в корзину отвечают методы site.basket.add и basket.putElement из файла: "basket.js"
После того как мы перенесли файлы на сайт с TPL шаблонизатором, необходимо отредактировать метод site.utils.js.init в файле "__common.js". В этом методе подключается файл "basket.js" и поэтому необходимо изменить адрес этого файла в соответствии с тем куда Вы его перенесли. В нашем случае после редактирования метод будет выглядеть так:
site.utils.js.init([
'/js/client/basket.js',
'/templates/demoold/js/basket.js',
]);
Далее нужно подключить необходимые файлы. В шаблоне дизайна сайта вам нужно подключить файл "__common.js"
Пример:
<script type="text/javascript" src="/js/jquery/jquery.js"></script>
<script type="text/javascript" src="/templates/demoold/js/__common.js"></script>
После того как фал подключен в шаблонах дизайна — нужно соответствующим образом модифицировать ссылку каталога на добавление товара.
Данная ссылка описана в tpl шаблоне: ~\tpls\emarket\default.tpl в блоке $FORMS['basket_add_link'].
Скрипт работает таким образом, что ищет необходимый элемент по ID и классу ссылки. По этому ссылка на добавление товара должна иметь следующий вид (если не модифицировать сам скрипт):
$FORMS['basket_add_link'] = <<<END
<a href="#" id="add_basket_%id%" class="basket_list">Положить в корзину</a>
END;
Теперь необходимо соответствующим образом изменить шаблон корзины. Для этого нам нужно в файле ~\tpls\emarket\basket.tpl добавить необходимые скрипту теги. А именно нужно присвоить значение класса class="block basket basket_info_summary" тегу
$FORMS['order_block'].
Пример:
$FORMS['order_block'] = <<<END
<div id="rubricator" class="block basket basket_info_summary">
После этого добавление в корзину будет выполнятся с помощью скрипта, и не будет больше перезагружать страницу.
