Копируем файл oneclick.php в папку ajax в корневую директорию вашего сайта
Открываем файл design/default/html/product.tpl находим строчку:
Код: Выделить всё
<input type="submit" class="button" value="в корзину" data-result-text="добавлено"/>
и под ней добавляем:
Код: Выделить всё
<!-- Покупка в один клик -->
<a href="#oneclick" class="button various oneclick">Купить в 1 клик</a>
<div style="display: none;">
<div id="oneclick" class="window">
<div class="title">Купить
{$product->name|escape|rtrim}</div>
<ul>
<li>
<h4><font color="red">*</font>Ваше имя:</h4>
<input class="onename" value="{$user->name|escape}" type="text" placeholder="Введите ваше имя">
</li>
<li>
<h4><font color="red">*</font>Ваш телефон:</h4>
<input class="onephone" value="{$user->phone|escape}" type="text" placeholder="Введите номер моб.телефона">
</li>
<li>
<h4><font color="red">*</font>Ваш адрес или отделение службы доставки:</h4>
<input class="oneaddress" value="{$user->address|escape}" type="text" placeholder="Введите адрес доставки">
</li>
<li>
<h4>Ваш комментарий:</h4>
<textarea class="onecomment" id="user_comment" name="comment" data-notice="Введите комментарий">{$user->comment|escape}</textarea>
</li>
Поля отмеченные <font color="red">*</font> обязательны к заполнению!
<li class="button_enter">
<button type="submit" name="enter" value="Отправить заказ" class="oneclickbuy gray_button">Отправить заказ</button>
</li>
</ul>
</div>
</div>
{literal}
<style>
.button.various { display: block; margin: 3px 0 0 0; padding: 3px 12px; font-size: 13px; }
#oneclick { width: 350px; font-size: 12px; }
#oneclick .title { font: 18px Arial; color: #000; margin-bottom: 7px; border-bottom: 1px solid #ccc; padding-bottom: 12px; }
#oneclick p,
#oneclick li { display: block; padding: 6px 0; }
#oneclick li span { display: inline-block; width: 80px; }
#oneclick input { width: 336px; }
#oneclick button { margin-top: 8px; }
#oneclick textarea {width: 336px; height: 100px; font-size: 12px; }
</style>
<script>
$(function() {
$(".various").fancybox({
helpers : {
overlay : {
locked : false
}
},
closeBtn: false,
fitToView: false,
autoSize: true,
minHeight: "0",
minWidth: "350",
scrolling: false,
closeClick : false,
openEffect : 'fade',
closeEffect : 'none'
});
$('.oneclickbuy').click( function() {
if($('.variants').find('input[name=variant]:checked').size()>0) variant = $('.variants input[name=variant]:checked').val();
if($('.variants').find('select[name=variant]').size()>0)
variant = $('.variants').find('select').val();
if( !$('.onename').val() || !$('.onephone').val() || !$('.oneaddress').val()) {
alert("Заполните обязательные поля!");
return false;
}
$.ajax({
type: "post",
url: "/ajax/oneclick.php",
data: {amount: 1, variant: variant, name: $('.onename').val() , phone: $('.onephone').val() , address: $('.oneaddress').val() , comment: $('.onecomment').val()},
dataType: 'json'
});
$('.oneclick').hide(200);
$("#oneclick").html("<div class='title'>Спасибо за заказ!</div><p>В ближайшее время с вами свяжется наш менеджер!</p><button type='submit' class='button' onclick='$.fancybox.close();$(\".oneclick\").hide();return false;'>Закрыть!</button>");
return false;
});
});
</script>
{/literal}
<!-- Покупка в один клик (The End) -->
Я вынес за пределы тега <form> так как после нажатия, у меня стоит всплывающая корзина , товар добавлялся в корзину.
Пробовал и с bootstrape 4 и с magnific. Помогите настроить.