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