Вход • Регистрация

Как изменять кнопку "в корзину" после нажатия ?

  • 26 октября 2018 г.
  • Здравствуйте. Есть сайт продающий товары. Попросили сделать на сайте кнопку как на озоне, там надпись на кнопке меняется при нажатии и при повторном нажатии происходит переход в корзину. С этим движком пока мало знаком. Как такое сделать? Заранее спасибо за ответы.
    • 26 октября 2018 г. , редакция: 26 октября 2018 г.
    • В shop.view.buy_form.php

      Ищем и кастомизируем:

      Код
      if (! empty($result["row"]["count_in_cart"]))


      Далее идем сюда: https://user.diafan.ru/forum/show4822/#47833
      • 26 октября 2018 г. , редакция: 26 октября 2018 г.
      • Мой вариант, без количества:

        Код
        echo '<div class="error alert "';
        if (! empty($result["row"]["count_in_cart"]))
        {
        echo '>','<a class="button button--large button--full button--outline" href="'.BASE_PATH_HREF.$result["result"]["cart_link"].'">Перейти в корзину</a>';
        }
        else
        {
        echo ' style="display:none;">';
        }
        echo '</div>';
    • 26 октября 2018 г. , редакция: 26 октября 2018 г.
    • То, что посоветовал Рома, сработает после перезагрузки страницы. Чтобы отработало в реальном времени,
      нужен файл в Вашей теме в папке /custom:
      /modules/shop/js/shop.buy_form.js

      Там (если нет) diafan_ajax.success["shop_buy"], вставляем его в начало, если есть, то правим под свои нужды.

      Чтобы было понятно, html-разметка у меня такая:
      Код
      if( empty($result["row"]["count_in_cart"]) ){

      echo '
      <label class="to_buy">
      <span class="buy_text">Купить</span>
      <input type="button" value="купить" class="cart button solid" action="buy">
      </label>
      <a class="fast_view" href="#" title="смотреть товар" data-id="'.$result["row"]["id"].'"><span>Быстрый просмотр</span></a>
      ';
      } else {

      echo '
      <a href="/catalog/cart/" class="in_cart_link"><label class="to_buy in_cart"><span class="buy_text">В корзине</span></label></a>
      <a class="fast_view go_cart" href="/catalog/cart/" title="в корзину"><span class="cart">Перейти в корзину</span></a>
      ';

      }
      Теперь приведу содержимое файла JS:
      Код
      diafan_ajax.success["shop_buy"]=function(form, response){

      // ищем в отработавшей форме кнопку
      var buy_button = $(form).find(".button.solid").parent('label');

      // если состояние кнопки не "в корзине"
      if( !$(buy_button).hasClass('in_cart') ){

      // добавляем класс для css-оформления кнопки и меняем текст на ней
      buy_button.addClass("in_cart").removeAttr("onclick").children(".buy_text").text("В корзине");

      // обёртываем кнопку добавления в корзину ссылкой. Следующий клик переведёт в неё
      buy_button.wrap("<a href='/catalog/cart/' class='in_cart_link'></a>");

      // меняем ссылку с быстрого просмотра на ссылку в корзину
      fast_view.attr({"class":"fast_view go_cart", "title":"в корзину", "href":"/catalog/cart/"});
      fast_view.children('span').addClass('cart').text("Перейти в корзину");
      }
      }
      Понятно, что у Вас будет свой велосипед, но принцип понятен.
      • 26 октября 2018 г.
      • Цитата
        То, что посоветовал Рома, сработает после перезагрузки страницы.
        Но у меня в реалтайме работает. Я по совету Степана, изменил вывод и в action. Жиэс не трогал.
      • 29 октября 2018 г. , редакция: 29 октября 2018 г.
      • Почитал про diafan_ajax.success. Не понял откуда берется метка_формы.
        У вас метка shop_buy. У себя в коде такой не нашел.
        • 29 октября 2018 г.
        • module = shop
          action = buy

          метка формы = shop_buy
          • 29 октября 2018 г.
          • Вообщем то вас метка не должна интересовать. Пропишите и посмотрите в консоль что прилетает после нажатия кнопки "купить"

            Код


            diafan_ajax.success['shop_buy'] = function(form, response){

            console.log($(form), response)

            }

  • 26 октября 2018 г.
  • Короче, я честно сказать что выше не писал но вот тебе код :)

    Код


    diafan_ajax.success['shop_buy'] = function(form, response){

    buyForm = formButton.closest('form');

    formButton.attr('data-action','off').val('Оформить').css('background','#75af32').css('border','2px solid #a22929').off('click').on('click',cartRedirect);

    }
    function cartRedirect(e) {
    var randStr = Math.floor(Math.random() * 1000000);
    window.location.href = "/cart?" + randStr;

    };

  • 27 октября 2018 г.

  • Всем спасибо. Сегодня или завтра буду разбираться. По результату отпишусь.

Новости

  • 18 июня
  • В сборке большое обновление demo-шаблона, дополнительная защита от спама, улучшение YML-импорта и еще много важного и интересного.
  • 24 апреля
  • В новой сборке совершили революцию в структурировании кастомизированной информации в шаблонах, добавили авторегистрацию пользователей, усовершенствовали защиту от спама, актуализировали накопительную скидку, а также улучшили производительность и стабильность работы системы.
  • 12 января
  • После выхода сборки 7.1 мы выпустили уже три патча, в каждом из которых улучшаем административную часть сайта. Сборка DIAFAN.CMS 7.1.3 уже доступна к установке. 

Форум