Всплывающее окно "продолжить" и "оформить заказ"

Каким образом можно сделать на minishop2 всплывающее окно при нажатии на кнопку «В корзину» с кнопками «Продолжить» и «Оформить заказ», пример такого окна есть в сниппете shopkeeper:


демо на shopkeeper demo-revo.modx-shopkeeper.ru/katalog/katalog-1/noutbuki/
пример кода с Modx Shopkeeper:

<script type="text/javascript">
function SHKfillCartCallback(form){
    if($('#goToOrderForm').size()>0) $('#goToOrderForm').remove();
    if($('#goToOrderForm_ovarlay').size()>0) $('#goToOrderForm_ovarlay').remove();
    var win_html = '<div id="goToOrderForm">'
    +'<p>Товар добавлен в корзину.<br /> Вы можете продолжить покупки или перейти на страницу оформления заказа.</p>'
    +'    <button>Продолжить</button>  '
    +'    <button>Оформить заказ</button>'
    +'</div>';
    var win_width = 300;
    var win_height = 100;
    var win_padding = 20;
    $(document.body).append('<div id="goToOrderForm_ovarlay"></div>');
    $(document.body).append(win_html);
    $('#goToOrderForm').css({
        'width': win_width+'px',
        'height': win_height+'px',
        'background': '#fff',
        'border': '1px solid #888',
        'text-align': 'center',
        'padding': win_padding+'px',
        'position': 'fixed',
        'top': '50%',
        'left': '50%',
        'z-index': '1000',
        'margin-top': 0-((win_height/2)+win_padding)+'px',
        'margin-left': 0-((win_width/2)+win_padding)+'px'
    })
    .find('button:eq(0)')
    .css('width','140px')
    .click(function(){
        $('#goToOrderForm_ovarlay').fadeOut(500,function(){
            $(this).remove();
            $('#goToOrderForm').remove();
        });
    })
    .next('button')
    .css('width','140px')
    .click(function(){
        window.location.href = shkOpt.orderFormPageUrl;
    });
    
    $('#goToOrderForm_ovarlay').css({
        'width': $(window).width()+'px',
        'height': $(document).height()+'px',
        'background-color': '#000',
        'opacity': 0.4,
        'position': 'absolute',
        'z-index': 10,
        'left': 0,
        'top': 0,
        'z-index': 110
    });
    
}
</script>
soch
06 августа 2014, 10:26
modx.pro
4
3 658
0

Комментарии: 4

Володя
06 августа 2014, 15:34
+1
miniShop2.Callbacks.Cart.add.response.success = function(response) {
	///тут код показа модалки
}
    soch
    06 августа 2014, 20:00
    0
    спасибо, то что нужно
      Виктор Лобанов
      09 декабря 2015, 19:31
      0
      Получилось реализовать такое окно? очень надо, не получается правильно вытащить данные о товаре в окно.
    Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
    4