Перейти к содержимому


Отправка В Корзину Из Модального Окна


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 10

#1 Coffee

Coffee

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 178 сообщений

Отправлено 03 Март 2015 - 18:24

Привет, друзья! Как вы прекрасно помните я люблю модальные окна :) недавно перейдя на новый шаблон "Нефрит" я внедрил их, конечно же, первым делом. Но при установке возникли трудности: окно ничего не отправляло в корзину. Я пытался аж в двух темах (первая, вторая) достучаться до службы поддержки, но безрезультатно, а судя по тому, что незаменимый сотрудник под никнеймом Cake заходил последний раз в конце 2014 года, стало понятно, что помочь некому.

Мои модальные окна пока что на одном из видов каталога (списком)

Тем не менее, установить модальное окно получилось самостоятельно и оно выполняет свои бесценные функции: выбор модификации, изменение кол-ва и отправка в корзину. Одно не выходит — это сообщение пользователю об удачной операции, вместо чего выскакивает:

"The requested content cannot be loaded.
Please try again later."

, что в контексте html звучит как:

<div style="overflow: hidden; width: 291px; height: auto;" class="fancybox-inner">
<p class="fancybox-error">The requested content cannot be loaded.<br>Please try again later.</p>
</div>

Короче ошибка фансибокс

Привожу реализацию отправки в корзину:

$('.arcticmodal-container .add-cart') .removeAttr('onclick') .click(function () {
var form = $(this) .closest('form');
$.post(form.attr('action'), form.serializeArray(), function (html, textStatus, jqXHR) {
	 var success = function (content) {
		 $('.cart-header:first').html($(content).find('.cart-header:first').html());
	
		 var message = $(content) .find('.messages');
		 if (message.length && message.find('.success') .length) {
			 $('.arcticmodal-close') .trigger('click');
		 }
		 $.fancybox({
			 content: message
		 });
		 setTimeout(function () {
			 if ($('.fancybox-inner .messages') .length) {
				 $('.fancybox-close') .trigger('click');
			 }
		 }, 500);
	 };
	 if (html.indexOf('window.location') !== -1) {
		 $.get('/cart', $.proxy(function(success, html) {
			 success(html);
		 }, this, success));
	 } else {
		 success(html);
	 }
});
return (false);
});
}

Где  content: message — это как раз то самое сообщение, которое должно выводить удачную отправку в корзину

Вопрос: как мне сделать сообщение пользователю подобно тому, как это происходит в карточке товара, а именно как на втором прикреплённом скрине (в вашей корзине... на сумму... перейти... продолжить...). Спасибо за помощь, очень надеюсь на вас!

Прикрепленные изображения

  • error.jpg
  • success.jpg


#2 Dars

Dars

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 1 410 сообщений

Отправлено 04 Март 2015 - 16:27

Просмотр сообщенияCoffee (03 Март 2015 - 18:24) писал:

Привет, друзья! Как вы прекрасно помните я люблю модальные окна :) недавно перейдя на новый шаблон "Нефрит" я внедрил их, конечно же, первым делом. Но при установке возникли трудности: окно ничего не отправляло в корзину. Я пытался аж в двух темах (первая, вторая) достучаться до службы поддержки, но безрезультатно, а судя по тому, что незаменимый сотрудник под никнеймом Cake заходил последний раз в конце 2014 года, стало понятно, что помочь некому.

Мои модальные окна пока что на одном из видов каталога (списком)

Тем не менее, установить модальное окно получилось самостоятельно и оно выполняет свои бесценные функции: выбор модификации, изменение кол-ва и отправка в корзину. Одно не выходит — это сообщение пользователю об удачной операции, вместо чего выскакивает:

"The requested content cannot be loaded.
Please try again later."

, что в контексте html звучит как:

<div style="overflow: hidden; width: 291px; height: auto;" class="fancybox-inner">
<p class="fancybox-error">The requested content cannot be loaded.<br>Please try again later.</p>
</div>

Короче ошибка фансибокс

Привожу реализацию отправки в корзину:

$('.arcticmodal-container .add-cart') .removeAttr('onclick') .click(function () {
var form = $(this) .closest('form');
$.post(form.attr('action'), form.serializeArray(), function (html, textStatus, jqXHR) {
	 var success = function (content) {
		 $('.cart-header:first').html($(content).find('.cart-header:first').html());
	
		 var message = $(content) .find('.messages');
		 if (message.length && message.find('.success') .length) {
			 $('.arcticmodal-close') .trigger('click');
		 }
		 $.fancybox({
			 content: message
		 });
		 setTimeout(function () {
			 if ($('.fancybox-inner .messages') .length) {
				 $('.fancybox-close') .trigger('click');
			 }
		 }, 500);
	 };
	 if (html.indexOf('window.location') !== -1) {
		 $.get('/cart', $.proxy(function(success, html) {
			 success(html);
		 }, this, success));
	 } else {
		 success(html);
	 }
});
return (false);
});
}

Где  content: message — это как раз то самое сообщение, которое должно выводить удачную отправку в корзину

Вопрос: как мне сделать сообщение пользователю подобно тому, как это происходит в карточке товара, а именно как на втором прикреплённом скрине (в вашей корзине... на сумму... перейти... продолжить...). Спасибо за помощь, очень надеюсь на вас!
Здравствуйте!
В main.js найдите код:

function QuickLook(url)
{
jQuery.ajax({
type: 'POST',
cache: false,
url: url,
data: {
		 only_body: 1
},
success: function (data)
{
		 var c = $('<div class="box-modal" />');
		 c.html(data);
		 c.prepend('<div class="box-modal_close arcticmodal-close">X</div>');
		 $.arcticmodal({
		 content: c,
		 afterOpen: function () {


  var 
	// Запоминаем поля выбора свойств, для ускорения работы со значениями свойств
	goodsDataProperties = $('.arcticmodal-container form.goodsDataForm select[name="form[properties][]"]'),

	// Запоминаем блоки с информацией по модификациям, для ускорения работы
	goodsDataModifications = $('.arcticmodal-container div.goodsDataMainModificationsList');
	updateEventGoodsProperties(goodsDataProperties, goodsDataModifications);
	addQtyButtonEvent();
	addFastViewCartButton();
			}
		});
	  }
	});
  }

и замените его на:

function QuickLook(url)
{
jQuery.ajax({
type: 'POST',
cache: false,
url: url,
data: {
		 only_body: 1
},
success: function (data)
{
		 var c = $('<div class="box-modal" />');
		 c.html(data);
		 c.prepend('<div class="box-modal_close arcticmodal-close">X</div>');
		 $.arcticmodal({
		 content: c,
		 afterOpen: function () {
		  $('.add-cart').click( function() {
			console.log(1)
			var form = $(this).closest('form');
			if ($(this).hasClass('quick')) {
			  form.attr('rel', 'quick');
			} else {
			  var rel = form.attr('rel');
			  if (rel) {
				form.attr('rel', rel.replace('quick', ''));
			  }
			}
			form.trigger('submit');
			return (false);
		  });
		  $('.goodsDataForm').submit(function() {
			// Выносим функции из шаблонов
			if ($(this).attr('rel') === 'quick') {
			  quickorder(this);
			  return (false);
			}
		   
			// Находим форму, которую отправляем на сервер, для добавления товара в корзину
			var formBlock = $($(this).get(0));
			var adresCart = '/cart';
			  // Проверка на существование формы отправки запроса на добавление товара в корзину
			  if (1 > formBlock.length || formBlock.get(0).tagName != 'FORM') {
				alert('Не удалось найти форму добавления товара в корзину');
				return false;
			  }
			 
			  // Получаем данные формы, которые будем отправлять на сервер
			  var formData = formBlock.serializeArray();
			  // Сообщаем серверу, что мы пришли через ajax запрос
			  formData.push({name: 'ajax_q', value: 1});
			  // Так же сообщим ему, что нужно сразу отобразить форму быстрого заказа
			  //formData.push({name: 'fast_order', value: 1});
			  // Аяксом добавляем товар в корзину и вызываем форму быстрого заказа товара
				$.ajax({
					type: "POST",
					cache: false,
					url: formBlock.attr('action'),
					data: formData,
					success: function(data) {
						w = $(window).width();
						if (w > 480) {
							$.fancybox({
								content: data
										// При изменении размера окна изменяем размер окна оформления заказа
										, onUpdate: function() {
									return false;
								}
							});
						} else {
							if (confirm('Товар был добален в корзину! Перейти в корзину?')) {
								window.location.href = adresCart;
							}
							;
						}
						setTimeout(function() {
							$.fancybox.update();
						}, 500);
					}
				});
				return false;
		  });
  
		  var
			// Запоминаем поля выбора свойств, для ускорения работы со значениями свойств
			goodsDataProperties = $('.arcticmodal-container form.goodsDataForm select[name="form[properties][]"]'),
		  
			// Запоминаем блоки с информацией по модификациям, для ускорения работы
			goodsDataModifications = $('.arcticmodal-container div.goodsDataMainModificationsList');
			updateEventGoodsProperties(goodsDataProperties, goodsDataModifications);
			addQtyButtonEvent();
		}
		});
	  }
	});
  }

Там же удалите код:

function addFastViewCartButton()
{
$('.arcticmodal-container .add-cart') .removeAttr('onclick') .click(function () {
  var form = $(this) .closest('form');
  $.post(form.attr('action'), form.serializeArray(), function (html, textStatus, jqXHR) {
		var success = function (content) {
		  $('.cart-header:first').html($(content).find('.cart-header:first').html());
	   
		  var message = $(content) .find('.messages');
		  if (message.length && message.find('.success') .length) {
				$('.arcticmodal-close') .trigger('click');
		  }
		  $.fancybox({
				content: message
		  });
		  setTimeout(function () {
				if ($('.fancybox-inner .messages') .length) {
				  $('.fancybox-close') .trigger('click');
				}
		  }, 500);
		};
		if (html.indexOf('window.location') !== -1) {
		  $.get('/cart', $.proxy(function(success, html) {
				success(html);
		  }, this, success));
		} else {
		  success(html);
		}
  });
  return (false);
});
}

Затем в шаблоне "Ajax добавление товара в корзину" найдите строку:

   <button type="button" title="Перейти в корзину" class="btn btn-success2 nyroModalClose"><span><span>Продолжить покупки</span></span></button>

и замените её на:

   <button type="button" title="Перейти в корзину" class="btn btn-success2 nyroModalClose" onclick="$.fancybox.close();"><span><span>Продолжить покупки</span></span></button>


#3 Coffee

Coffee

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 178 сообщений

Отправлено 04 Март 2015 - 16:46

Просмотр сообщенияDars (04 Март 2015 - 16:27) писал:

Здравствуйте!
В main.js найдите код:

...

Спасибо, сообщение появляется, но остались следующие проблемы:
  • Не обновляется корзина (только после обновления вручную)
  • Не пропадают окна при нажатии "продолжить покупки"


#4 Coffee

Coffee

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 178 сообщений

Отправлено 10 Март 2015 - 01:34

  • Не обновляется корзина (только после обновления вручную)
  • Не пропадает модальное окно при нажатии "продолжить покупки"


#5 Coffee

Coffee

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 178 сообщений

Отправлено 12 Март 2015 - 15:03

Проблема сохраняется

#6 Coffee

Coffee

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 178 сообщений

Отправлено 16 Март 2015 - 13:28

Просмотр сообщенияDars (04 Март 2015 - 16:27) писал:





Проблема сохраняется, пожалуйста, давайте доделаем

#7 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 16 Март 2015 - 14:33

Просмотр сообщенияCoffee (16 Март 2015 - 13:28) писал:

Проблема сохраняется, пожалуйста, давайте доделаем
Здравствуйте, найдите в шаблоне  Ajax добавление товара в корзину
<script>
$('#cartSum').html($('.newCartSum').html());
$('#cartCount').html($('.newCartCount').html());
</script>
замените на
<script>
$('#cartSum').html($('.newCartSum').html());
$('#cartCount').html($('.newCartCount').html());
$('.cartSumP').html($('.newCartSum').html());
</script>


#8 Coffee

Coffee

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 178 сообщений

Отправлено 16 Март 2015 - 14:45

Просмотр сообщенияИрина345 (16 Март 2015 - 14:33) писал:

Здравствуйте, найдите в шаблоне  Ajax добавление товара в корзину
<script>
$('#cartSum').html($('.newCartSum').html());
$('#cartCount').html($('.newCartCount').html());
</script>
замените на
<script>
$('#cartSum').html($('.newCartSum').html());
$('#cartCount').html($('.newCartCount').html());
$('.cartSumP').html($('.newCartSum').html());
</script>
Спасибо за быстрый ответ. Но к сожалению корзина не обновляется (
2. И ещё пожалуйста как сделать, чтобы при клике на "продолжить покупки" модальное окно arcticmodal убиралось автоматически

#9 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 16 Март 2015 - 19:28

Просмотр сообщенияCoffee (16 Март 2015 - 14:45) писал:


2. И ещё пожалуйста как сделать, чтобы при клике на "продолжить покупки" модальное окно arcticmodal убиралось автоматически
Просмотри сайт, у вас при нажатие на "продолжить покупки" окно закрывается.

#10 Coffee

Coffee

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 178 сообщений

Отправлено 16 Март 2015 - 20:23

Просмотр сообщенияИрина345 (16 Март 2015 - 19:28) писал:

Просмотри сайт, у вас при нажатие на "продолжить покупки" окно закрывается.
  • нет, в каталоге списком не закрывается. я имею в виду div "arcticmodal-container"

  • корзина не обновляется во всех случаях
очистил историю полностью

#11 Coffee

Coffee

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 178 сообщений

Отправлено 18 Март 2015 - 12:23

Просмотр сообщенияИрина345 (16 Март 2015 - 19:28) писал:

Просмотри сайт, у вас при нажатие на "продолжить покупки" окно закрывается.
пожалуйста, давайте доделаем,

корзина не обновляется
arcticmodal не закрывается




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных