Kami Опубликовано 8 октября, 2018 Жалоба Поделиться Опубликовано 8 октября, 2018 В продолжение темы http://forum.simplacms.ru/topic/8892-%D0%BA%D1%83%D0%BF%D0%B8%D1%82%D1%8C-%D0%B2-1-%D0%BA%D0%BB%D0%B8%D0%BA/ Так и не нашел ответа как сделать чтоб на странице products работал модуль "купить в 1 клик" Вариант корса http://forum.simplacms.ru/topic/8892-купить-в-1-клик/?p=67022 успехов не дал. Вопрос в следующем. имеем тот же самый oneclick.php выводим кнопку в цикле вывода всех товаров. <a href="#oneclick" class="button various oneclick" data-name="{$product->name}" >в 1 клик</a> добавляем атрибут data-name <div id="oneclick" class="window" style="display: none;"> <div id="oneclick_name_product"></div> <ul> <li><span>Ваше имя:</span><input class="onename" value="" type="text"></li> <li><span>Телефон:</span><input class="onephone" value="" type="text"></li> </ul> <button type="submit" name="enter" value="1" class="oneclickbuy button">Заказать</button> </div> {literal} <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() { $("#oneclick_name_product").html($(this).data('name')); var frm=$(this).closest('form.variants') if(frm.find('input[name=variant]:checked').size()>0) variant = frm.find('input[name=variant]:checked').val(); if(frm.find('select[name=variant]').size()>0) variant = frm.find('select').val(); if( !$('.onename').val() || !$('.onephone').val() ) { alert("Заполните все поля!"); return false; } $.ajax({ type: "post", url: "/ajax/oneclick.php", data: {amount: 1, variant: variant, name: $('.onename').val() , phone: $('.onephone').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} Вопрос в следующем, почему не подтягивается наименование товара с атрибута $("#oneclick_name_product").html($(this).data('name')); и второе, думаю нужен input под hidden чтоб туда присваивать value варианта. Так ли это? В целом нужно чтоб каждый товар было возможно купить в 1 клик в каталоге. Ну и интересует изображение товара подтянуть. Благодарен за любые подсказки. Цитата Ссылка на сообщение Поделиться на другие сайты
Решение chocolate_moles Опубликовано 8 октября, 2018 Решение Жалоба Поделиться Опубликовано 8 октября, 2018 (изменено) Это в товар <button type="button" class="js-one-click" data-name="{$product->name|escape}" data-id="{$product->variant->id}" data-src="{$product->image->filename|resize:200:200}">Купить в 1 клик</button> Это в низ index.tpl <style> #oneclick-image{ width: 100px; height: 100px; background-repeat: no-repeat; background-position: center; background-size: contain; } </style> <div style="display: none"> <form id="oneclick"> <h2>Заказ в 1 клик "<span id="oneclick-product"></span>"</h2> <div id="oneclick-image"></div> <label>Имя</label> <input type="text" name="name" id="oneclick-name" required> <label>Телефон</label> <input type="tel" name="phone" id="oneclick-phone" required> <input type="submit" value="Заказать"> </form> </div> <script> (function($){ 'use strict'; var name, id, src; $('.js-one-click').on('click', function(e){ e.preventDefault(); var $btn = $(this); name = $btn.data('name'); id = $btn.data('id'); src = $btn.data('src'); $('#oneclick-product').text(name); $('#oneclick-image').css('background-image', 'url(' + src + ')'); $.fancybox('#oneclick'); }); $('#oneclick').on('submit', function(e){ e.preventDefault(); $.ajax({ type: "post", url: "ajax/oneclick.php", data: { 'amount': 1, 'variant': id, 'name': $('#oneclick-name').val(), 'phone': $('#oneclick-phone').val() }, dataType: 'json', success: function(data){ alert('Ok!'); } }); }); })(window.jQuery); </script> Изменено 8 октября, 2018 пользователем chocolate_moles Цитата Ссылка на сообщение Поделиться на другие сайты
Kami Опубликовано 8 октября, 2018 Автор Жалоба Поделиться Опубликовано 8 октября, 2018 Это в товар <button type="button" class="js-one-click" data-name="{$product->name|escape}" data-id="{$product->variant->id}" data-src="{$product->image->filename|resize:200:200}">Купить в 1 клик</button> Это вниз index.tpl <form id="oneclick"> <h2>Заказ в 1 клик</h2> <label>Имя</label> <input type="text" name="name" id="oneclick-name" required> <label>Телефон</label> <input type="text" name="phone" id="oneclick-phone" required> <input type="submit" value="Заказать"> </form> <script> (function($){ 'use strict'; var name, id, src; $('.js-one-click').on('click', function(e){ e.preventDefault(); var $btn = $(this); name = $btn.data('name'); id = $btn.data('id'); src = $btn.data('src'); $.fancybox('#oneclick'); }); $('#oneclick').on('submit', function(e){ e.preventDefault(); $.ajax({ type: "post", url: "ajax/oneclick.php", data: { 'amount': 1, 'variant': id, 'name': $('#oneclick-name').val(), 'phone': $('#oneclick-phone').val() }, dataType: 'json', success: function(data){ alert('Ok!'); } }); }); })(window.jQuery); </script> Спасибо, а во всплывающую форму вывести изображение и заголовок товара который в данный момент приобретаем, не подскажете? Цитата Ссылка на сообщение Поделиться на другие сайты
Noxter Опубликовано 8 октября, 2018 Жалоба Поделиться Опубликовано 8 октября, 2018 Ужас! Результат кривых рук, на выходе говнокод. Цитата Ссылка на сообщение Поделиться на другие сайты
Kami Опубликовано 8 октября, 2018 Автор Жалоба Поделиться Опубликовано 8 октября, 2018 Ужас! Результат кривых рук, на выходе говнокод. о каком коде идет речь? о том что chocolate_moles предоставил? Цитата Ссылка на сообщение Поделиться на другие сайты
chocolate_moles Опубликовано 8 октября, 2018 Жалоба Поделиться Опубликовано 8 октября, 2018 Спасибо, а во всплывающую форму вывести изображение и заголовок товара который в данный момент приобретаем, не подскажете? Обновил предыдущее свое сообщение Цитата Ссылка на сообщение Поделиться на другие сайты
Kami Опубликовано 8 октября, 2018 Автор Жалоба Поделиться Опубликовано 8 октября, 2018 Обновил предыдущее свое сообщение Спасибо, получается если фото нет то заглушку уже не выведешь? Цитата Ссылка на сообщение Поделиться на другие сайты
chocolate_moles Опубликовано 8 октября, 2018 Жалоба Поделиться Опубликовано 8 октября, 2018 (изменено) Спасибо, получается если фото нет то заглушку уже не выведешь? data-src="{$product->image->filename|resize:200:200}" замените на data-src="{if $product->image}{$product->image->filename|resize:200:200}{else}design/{$settings->theme|escape}/images/no-image.png{/if}" где design/{$settings->theme|escape}/images/no-image.png путь к изображению заглушки Изменено 8 октября, 2018 пользователем chocolate_moles Цитата Ссылка на сообщение Поделиться на другие сайты
Noxter Опубликовано 8 октября, 2018 Жалоба Поделиться Опубликовано 8 октября, 2018 о каком коде идет речь? о том что chocolate_moles предоставил?Да вообще подход к реализации, то бишь всё скопом. Цитата Ссылка на сообщение Поделиться на другие сайты
phukortsin Опубликовано 9 октября, 2018 Жалоба Поделиться Опубликовано 9 октября, 2018 Ужас! Результат кривых рук, на выходе говнокод. Да вообще подход к реализации, то бишь всё скопом. Если бы дело ограничивалось тем, что некрасиво запихали разнородный материал в один файл, было бы полбеды.Но есть и более существенные недостатки.1. При подаче заказе возникает сначала fancybox-окно для ввода данных полкупателя, а потом поверх него еще alert-окно. И по окончании заказа, надо отдельно кликнуть для закрытия alert-окна, и отдельно кликнуть для закрытия fancybox-окна. Для доработки под названием '1 клик' - явный перебор...2. В текущем виде не работает правильно в случае, если у товара несколько вариантов. Надо, например, кнопку в цикле вариантов менять примерно так:<button type="button" ...data-id="{$v->id}" ...>Купить в 1 клик</button>А лучше, конечно, ставить одну кнопку с соответствующей доработкой для определения варианта... Цитата Ссылка на сообщение Поделиться на другие сайты
daramal Опубликовано 20 октября, 2018 Жалоба Поделиться Опубликовано 20 октября, 2018 Это в товар <button type="button" class="js-one-click" data-name="{$product->name|escape}" data-id="{$product->variant->id}" data-src="{$product->image->filename|resize:200:200}">Купить в 1 клик</button> Это в низ index.tpl <style> #oneclick-image{ width: 100px; height: 100px; background-repeat: no-repeat; background-position: center; background-size: contain; } </style> <div style="display: none"> <form id="oneclick"> <h2>Заказ в 1 клик "<span id="oneclick-product"></span>"</h2> <div id="oneclick-image"></div> <label>Имя</label> <input type="text" name="name" id="oneclick-name" required> <label>Телефон</label> <input type="tel" name="phone" id="oneclick-phone" required> <input type="submit" value="Заказать"> </form> </div> <script> (function($){ 'use strict'; var name, id, src; $('.js-one-click').on('click', function(e){ e.preventDefault(); var $btn = $(this); name = $btn.data('name'); id = $btn.data('id'); src = $btn.data('src'); $('#oneclick-product').text(name); $('#oneclick-image').css('background-image', 'url(' + src + ')'); $.fancybox('#oneclick'); }); $('#oneclick').on('submit', function(e){ e.preventDefault(); $.ajax({ type: "post", url: "ajax/oneclick.php", data: { 'amount': 1, 'variant': id, 'name': $('#oneclick-name').val(), 'phone': $('#oneclick-phone').val() }, dataType: 'json', success: function(data){ alert('Ok!'); } }); }); })(window.jQuery); </script> Спасибо за реализацию. Очень удобно.Только вот возник вопрос. Разместил также все это на страничку товара (product.tpl) в сам товар и работает отлично.Также на данной странице есть товары "Похожие/связанные товары", так вот когда кнопку привязываю к этим товарам, то при нажатии кнопки окошка тянет именно главный товар и только его. Получает он не видит "Связанные товары". Можно ли это как-то обыграть? Спасибо большое Цитата Ссылка на сообщение Поделиться на другие сайты
chocolate_moles Опубликовано 21 октября, 2018 Жалоба Поделиться Опубликовано 21 октября, 2018 Спасибо за реализацию. Очень удобно.Только вот возник вопрос. Разместил также все это на страничку товара (product.tpl) в сам товар и работает отлично.Также на данной странице есть товары "Похожие/связанные товары", так вот когда кнопку привязываю к этим товарам, то при нажатии кнопки окошка тянет именно главный товар и только его. Получает он не видит "Связанные товары". Можно ли это как-то обыграть? Спасибо большое Скорее всего у вас для связанных товаров в коде кнопки нужно заменить $product на $related_product Цитата Ссылка на сообщение Поделиться на другие сайты
daramal Опубликовано 21 октября, 2018 Жалоба Поделиться Опубликовано 21 октября, 2018 Скорее всего у вас для связанных товаров в коде кнопки нужно заменить $product на $related_productОгромное спасибо. Точно помогло )) Цитата Ссылка на сообщение Поделиться на другие сайты
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.