Корзина без перезагрузки

[kanasahanov]

Здравствуйте. При изменении количества товара в корзине нужно нажать на кнопку обновить и страница перезагружается. Подскажите пожалуйста приблизительный алгоритм как можно реализовать этот функционал БЕЗ перезагрузки страницы. чтобы можно было ввести новое количество, нажать кнопку и обновилась итоговая цена заказа. заранее спасибо за ответы

[EVMedvedev]

Такое всегда делается ajax запросами. Добавьте свой экшн в какой нибудь контроллер (в принципе на самом деле даже не важно в какой но лучше в контроллер корзины наверное) куда будете сбрасывать идентификатор товара в корзине и количество, а возвращать будете либо новые данные корзины (общая стоимость и количество) либо весь HTML код корзины, а дальше JS кодом меняете соответствующий фрагмент HTML кода страницы на новый.

[kanasahanov]

прошу прощения. но что за экшн? и и в какое место catalog/controller/checkout/cart.php его необходимо добавить?

[kourysan]

Ваша задача, которая достаточно просто выглядит на первый взгляд, решается не очень не просто.

Попытаюсь несколько прояснить то, что вам посоветовали выше.

1) используя javascript вам нужно на клик по кнопке обновления повесить обработчик, который будет посылать ajax запрос на обновление содержимого корзины и возвращать результат

2) полученный результат с корзиной (JSON или HTML) нужно отобразить на странице, вместо существующего

 

 

php обработчик можете добавить в файл catalog/controller/checkout/cart.php в виде нового метода, назвав его, например, cart_update(). По сути он должен выполнять то же,что и имеющийся метод index(), а именно обновлять число товаров в корзине и вычислять total по всем правилам. Отличие в том, что он должен уметь работать с ajax.

[kanasahanov]

спасибо за ответ хоть что то немного понятно. но у меня вопрос. а как сделать так, чтобы данные посылаемые через аякс обрабатывал именно метод cart_update?

 

В cart.tpl я пока что добавил вот такой вот тестовый скрипт (здесь для инпута количества и кнопки обновления я добавил классы для удобства)

 

<script type="text/javascript">

  $(document).ready(function() {

    $(".update-btn").bind("click", function() {

      $.ajax({

          url: 'index.php?route=checkout/cart&quantity=' + $('input.quantity-field').val(), 

          type: 'post',

          data: 'quantity=' + $('input.quantity-field').val(), 

          dataType: "json",

          beforeSend: alert('Ожидание данных...'),

          success: alert('DONE')

      });

    });

  });

</script>

 

Но что то не работает.  я с аяксом знаком только со вчерашнего вечера, так что пожалуйста не судите строго

[Meloman]

Вам же написали, что метод  index() не умеет работать с ajax. Надо писать свой метод, который будет обрабатывать именно аякс запросы.

В url надо просто "index.php", а в data строку запроса - data: "route=checkout/cart&quantity=" + $('input.quantity-field').val() (лучше в двойные кавычки брать)

Посмотрите в браузере, какой уходит запрос и какой приходит ответ.

Вставьте обработчик error или complete, чтобы хоть знать что запрос завершился

 

И отключите кеш, cache: false (по умолчанию включен)