Исключение шагов оформления заказа и переход к оформлению заказа по кнопке =Купить=
Dexcius
12 ноября 2012 г.
В данном решении я расскажу об одновременном решении двух задач:
- как исключить шаги при оформлении заказа
и
- как по кнопке "Купить" сразу уходить к оформлению заказа.
Такую задачу необходимо решать тем магазинам, где чаще всего клиенты покупают по одному товару и не желают париться с корзиной, как таковой.
Общая схема решения следующая:
- в карточке товара мы подменяем действие по умолчанию для кнопки "купить" и после бросания товара в корзину выполняем переход на N-ный пункт оформления заказа.
- для корректного перехода на N-ный пункт оформления заказа необходимо обеспечить автозаполнение формы инфо о покупателе из 1-го пункта оформления заказа.
- в принципе переход возможен на любой пункт оформления, важно помнить, что предыдущие формы должны быть системе отданы минимально заполненными.
Изменения в карточке товара.
Изменение производится в XSL-шаблоне МагазинТовар. Во-первых, находим код
Это код собственно кнопки "Купить". Вместо этой строки нам необходимо организовать форму, которая будет заменять собой весь первый пункт оформления товара, а именно ввод информации о пользователе:
Всё хорошо, и по нажатию кнопки "Купить" мы уходим на нужный нам пункт оформления товара. Но тут возникает один нюанс: тот товар, с которого мы ушли на оформление, в корзину не добавлен! А это означает, что нам необходимо организовать всё так, чтобы при нажатии на кнопку "Купить" происходило сразу два действия: добавление товара в корзину и переход на оформление.
Здесь мы используем JQuery. Скрипт следующий:
Аналогичный способ применяется для XSL-шаблона МагазинКаталогТовара, если нам необходимо выводить кнопку "Купить" прямо возле каждого товара в каталоге товаров.
Необходимо лишь заметить, что в этом шаблоне уже есть форма <form method="POST">, нужно только снабдить ее классом и экшном.
- как исключить шаги при оформлении заказа
и
- как по кнопке "Купить" сразу уходить к оформлению заказа.
Такую задачу необходимо решать тем магазинам, где чаще всего клиенты покупают по одному товару и не желают париться с корзиной, как таковой.
Общая схема решения следующая:
- в карточке товара мы подменяем действие по умолчанию для кнопки "купить" и после бросания товара в корзину выполняем переход на N-ный пункт оформления заказа.
- для корректного перехода на N-ный пункт оформления заказа необходимо обеспечить автозаполнение формы инфо о покупателе из 1-го пункта оформления заказа.
- в принципе переход возможен на любой пункт оформления, важно помнить, что предыдущие формы должны быть системе отданы минимально заполненными.
Изменения в карточке товара.
Изменение производится в XSL-шаблоне МагазинТовар. Во-первых, находим код
<a href="{/shop/url}cart/?add={@id}" class="vkorzinu" onclick="return $.addIntoCart('{/shop/url}cart/', {@id}, 1)">В корзину!</a>
Это код собственно кнопки "Купить". Вместо этой строки нам необходимо организовать форму, которая будет заменять собой весь первый пункт оформления товара, а именно ввод информации о пользователе:
<!-- Новая форма покупки товара -->
<form class="tovarform" action="/shop/cart/" method="POST">
<!-- Необходимые поля для эмуляции первого пункта оформления заказа -->
<!-- Поля, которые клиент обязан ввести, это обычный input -->
<input type="text" size="15" class="form-field2" name="surname" value="" />
<!-- Поля, которые клиент вводить не должен, имеют тип hidden -->
<input type="hidden" name="name" value="-" />
<input type="hidden" name="patronymic" value="-" />
<input type="text" size="30" name="phone" value="" class="form-field2" />
<input type="text" size="30" name="email" value="" class="form-field2" />
<!-- ВАЖНО: номер пункта оформления заказа, на который уходим после нажатия =Купить= -->
<input name="step" value="3" type="hidden" />
<!-- собственно кнопка =Купить= -->
<input class="zsubmit-button" type="submit" value="Купить!" />
</form>
<form class="tovarform" action="/shop/cart/" method="POST">
<!-- Необходимые поля для эмуляции первого пункта оформления заказа -->
<!-- Поля, которые клиент обязан ввести, это обычный input -->
<input type="text" size="15" class="form-field2" name="surname" value="" />
<!-- Поля, которые клиент вводить не должен, имеют тип hidden -->
<input type="hidden" name="name" value="-" />
<input type="hidden" name="patronymic" value="-" />
<input type="text" size="30" name="phone" value="" class="form-field2" />
<input type="text" size="30" name="email" value="" class="form-field2" />
<!-- ВАЖНО: номер пункта оформления заказа, на который уходим после нажатия =Купить= -->
<input name="step" value="3" type="hidden" />
<!-- собственно кнопка =Купить= -->
<input class="zsubmit-button" type="submit" value="Купить!" />
</form>
Всё хорошо, и по нажатию кнопки "Купить" мы уходим на нужный нам пункт оформления товара. Но тут возникает один нюанс: тот товар, с которого мы ушли на оформление, в корзину не добавлен! А это означает, что нам необходимо организовать всё так, чтобы при нажатии на кнопку "Купить" происходило сразу два действия: добавление товара в корзину и переход на оформление.
Здесь мы используем JQuery. Скрипт следующий:
$(document).ready(function(){
$(".zsubmit-button").click( function() {
<!-- добавим товар с нужным кодом и кол-вом в корзину -->
$.addIntoCart('/shop/cart/', <код товара> , <кол-во товара> );
<!-- и уйдем на указанный в форме пункт оформления заказа -->
$(".tovarform").submit();
});
});
$(".zsubmit-button").click( function() {
<!-- добавим товар с нужным кодом и кол-вом в корзину -->
$.addIntoCart('/shop/cart/', <код товара> , <кол-во товара> );
<!-- и уйдем на указанный в форме пункт оформления заказа -->
$(".tovarform").submit();
});
});
Аналогичный способ применяется для XSL-шаблона МагазинКаталогТовара, если нам необходимо выводить кнопку "Купить" прямо возле каждого товара в каталоге товаров.
Необходимо лишь заметить, что в этом шаблоне уже есть форма <form method="POST">, нужно только снабдить ее классом и экшном.
Авторизация
