Изменение количества товаров в корзине tpl — различия между версиями

Материал из Umicms
Перейти к:навигация, поиск
(Новая страница: «Для того, чтобы пользователь мог в корзине менять количество товаров Если вас интересуе…»)
 
Строка 1: Строка 1:
 
Для того, чтобы пользователь мог в корзине менять количество товаров  
 
Для того, чтобы пользователь мог в корзине менять количество товаров  
  
 +
Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с помощью модуля обратная связь работать без перезагрузки страницы.
 +
В этом нам поможет jquery плагин Form.
 +
Для начала открываем шаблон, где размещается шапка необходимой нам страницы и между тэгами head, в самом низу добавляем строчки
 +
<source lang="php">
 +
<!-- ajax jquery Forms -->
 +
<script src="http://malsup.github.com/jquery.form.js" type="text/javascript"></script>
 +
<!-- end ajax jquery forms -->
 +
</source>
 +
Внимание строчка обязательно должна быть ниже макросов
 +
<source lang="php">
 +
%system includeQuickEditJs()%
 +
%system includeEditInPlaceJs()%
 +
</source>
 +
Всё, с шапкой закончили, так как сам jquery у нас уже подключен, макросами
 +
<source lang="php">
 +
%system includeQuickEditJs()%
 +
%system includeEditInPlaceJs()%
 +
</source>
 +
Теперь переходим к шаблону вебформ.
 +
Открываем его.(если вы ничего не меняли, то он находиться по адресу /templates/demoold/tpls/default.tpl)
 +
и после блока
 +
<source lang="php">
 +
$FORMS['order_block'] = <<<END
 +
<h3>Информация о покупателе</h3>
 +
<p>%emarket getCustomerInfo()%</p>
 +
<h3>Список покупок</h3>
 +
</source>
 +
Вставляем вот такой код:
 +
<source lang="php">
 +
<script language="JavaScript" type="text/javascript">
 +
    function change_but(id) {
 +
        var getvalue = $('#input-amount-'+id).val();
 +
        jQuery.post("/emarket/basket/put/element/"+id+"/", {amount: getvalue});
  
 +
        alert(getvalue);
 +
        location.reload();
 +
    }
 +
</script>
 +
</source>
 +
 +
Затем ищем код
 +
<source lang="php">
 +
$FORMS['order_item'] = <<<END
 +
<tr>
 +
<td>
 +
#
 +
</td>
 +
 +
<td>
 +
<a href="%link%">%name%</a>
 +
</td>
 +
 +
<td>
 +
%options%
 +
</td>
 +
 +
<td>
 +
</source>
 +
 +
И после тэга <td> вставляем следующий код
 +
 +
<source lang="php">
 +
<input id="input-amount-%element_id%" type="text" value="%amount%">
 +
<input type='button' value='Change' onClick="change_but(%element_id%)">
 +
</source>
 +
 +
Сохраняем шаблон. и на этом всё. Теперь пользователь сможет в корзине изменять количество товара
  
 
Если вас интересует вариант для xslt, то смотрите стандартный шаблон demodizzy "интернет-магазин современный", там это уже по умолчанию реализовано.
 
Если вас интересует вариант для xslt, то смотрите стандартный шаблон demodizzy "интернет-магазин современный", там это уже по умолчанию реализовано.

Версия 16:32, 28 ноября 2012

Для того, чтобы пользователь мог в корзине менять количество товаров

Сейчас мы в несколько довольно несложных действий заставим нашу вебформу, добавленную с помощью модуля обратная связь работать без перезагрузки страницы. В этом нам поможет jquery плагин Form. Для начала открываем шаблон, где размещается шапка необходимой нам страницы и между тэгами head, в самом низу добавляем строчки

<!-- ajax jquery Forms -->
<script src="http://malsup.github.com/jquery.form.js" type="text/javascript"></script>
<!-- end ajax jquery forms -->

Внимание строчка обязательно должна быть ниже макросов

%system includeQuickEditJs()%
%system includeEditInPlaceJs()%

Всё, с шапкой закончили, так как сам jquery у нас уже подключен, макросами

%system includeQuickEditJs()%
%system includeEditInPlaceJs()%

Теперь переходим к шаблону вебформ. Открываем его.(если вы ничего не меняли, то он находиться по адресу /templates/demoold/tpls/default.tpl) и после блока

$FORMS['order_block'] = <<<END
<h3>Информация о покупателе</h3>
<p>%emarket getCustomerInfo()%</p>
<h3>Список покупок</h3>

Вставляем вот такой код:

<script language="JavaScript" type="text/javascript">
    function change_but(id) {
        var getvalue = $('#input-amount-'+id).val();
        jQuery.post("/emarket/basket/put/element/"+id+"/", {amount: getvalue});

        alert(getvalue);
        location.reload();
    }
</script>

Затем ищем код

$FORMS['order_item'] = <<<END
<tr>
	<td>
		#
	</td>

	<td>
		<a href="%link%">%name%</a>
	</td>

	<td>
		%options%
	</td>

	<td>

И после тэга вставляем следующий код

<input id="input-amount-%element_id%" type="text" value="%amount%">
<input type='button' value='Change' onClick="change_but(%element_id%)">

Сохраняем шаблон. и на этом всё. Теперь пользователь сможет в корзине изменять количество товара

Если вас интересует вариант для xslt, то смотрите стандартный шаблон demodizzy "интернет-магазин современный", там это уже по умолчанию реализовано.