Регистрация
Регистрируясь, вы подтверждаете свое согласие с соглашением об использовании персональных данных.
Восстановление пароля

ajax добавление в сравнение

19.01.2016, 20:47
Гость
Гость

Здравствуйте!
Подскажите, пожалуйста, как реализовать добавление товара в список сравнения без перезагрузки страницы?
В демо сайте нашёл такой вот код:
Код:
/*
* Добавление/удаление в сравнение и избранное
*/
footer_tabs = {
recent: {
tab_index: 0,
source: '.tpl-widget-netshop-viewed-by-user'
},
compare: {
tab_index: 1,
source: '.tpl-widget-netshop-compare',
additional_content: '.tpl-block-compare-button',
link: '.tpl-link-compare-add, .tpl-link-compare-remove',
popups: '#goodslist-compare-add, #goodslist-compare-remove',
actions: {
'.tpl-link-compare-add': {
links_to_show: '.tpl-link-compare-remove, .tpl-link-compare',
popup: '#goodslist-compare-add'
},
'.tpl-link-compare-remove': {
links_to_show: false,
popup: false
}
}
},
favorite: {
tab_index: 2,
source: '.tpl-widget-netshop-favorite',
link: '.tpl-link-favorite-add, .tpl-link-favorite-remove',
popups: '#goodslist-favorite-add, #goodslist-favorite-remove',
actions: {
'.tpl-link-favorite-add': {
links_to_show: '.tpl-link-favorite-remove, .tpl-link-favorite',
popup: '#goodslist-favorite-add'
},
'.tpl-link-favorite-remove': {
links_to_show: false,
popup: false
}
}
}
};

Но, судя по всему здесь с использованием виджета. А вот как добавить товар в список сравнения, показать модальное окно и изменить ссылку добавления в сравнение на ссылку удаления из сравнения не понятно.
Знаний в js маловато.
25.01.2016, 11:07
Вячеслав
ruCreate
Вячеслав

Зарегистрирован:
2013-04-12
Сообщений: 87

Можно так.
Ссылка на добавление
Код:

<? if (!$is_in_compare_list) { ?>
<a href="<?= $netshop->goodslist_compare->get_add_action_url($item['Message_ID'], $item['Class_ID'], $_SERVER['REQUEST_URI'] . '#'); ?>" id='compare' class='vis'>в сравнения</a>
<? } else { ?>
<a href="/compare/" id='compare' >уже в сравнениях</a>
<? } ?>


Такой js
Код:

$('#compare.vis').click(function(e){
e.preventDefault();
$.ajax({
url: $(this).attr('href'),
success: function(result){
$('#compare').replaceWith($('#compare', result));
}
})
});


Этот код добавит без перезагрузки. Дальше работайте с переменными netcat
08.02.2016, 18:56
Kit

Зарегистрирован:
2016-02-02
Сообщений: 12

тоже возникла такая необходимость.
Немного переделал для использования не с id, а с классами, т.к. нужно добавлять в сравнение на странице со списком товаров.
Код:
$('.add_compare').click(function(e){            
event.preventDefault();
$.ajax({
url: $(this).attr('href'),
success: function(result){
$('.add_compare').replaceWith($('.add_compare', result));
}
})
});

Теперь возник вопрос: как добавлять в сравнение товары в списке товаров, без перезагрузки страницы?
получается что после добавления товара нужно обновить состояние кнопки добавления в сравнение. А т.к. на странице несколько товаров (страница со списком товаров), и у всех товаров есть кнопка с таким классом и происходит то, что не должно происходить - у каждого товара выводится столько кнопок добавить в сравнение, сколько товаров на странице.
Как это можно поправить?
Спасибо!
25.04.2017, 17:26
Kit

Зарегистрирован:
2016-02-02
Сообщений: 12

С изменением текста ссылки и самой ссылки разобрался.
Получилось менять ссылку: если товар не добавлен в сравнение, то показывается ссылка на добавление. Если добавлен, то показывается ссылка на удаление из списка сравнения.
Одна проблема:
При загрузке страницы добавление товара в список сравнения происходит без перезагрузки страницы. Текст ссылки и сама ссылка меняются на удаление из списка сравнения, вот только если кликнуть на эту ссылку, то удаление уже происходит с перезагрузкой страницы, т.е. кликаем по ссылке и происходит перезагрузка страницы.
Если добавить товар (или несколько товаров) в список сравнения, а потом обновить страницу, то клик по ссылкам удаления товара из списка сравнения тоже происходит без перезагрузки страницы и текст ссылки и сама ссылка меняются на добавление в список сравнения, клик по этим ссылкам опять перезагружает страницу.
Т.е. всё работает, но без перезагрузки страницы поменять статус товара "добавить в сравнение/удалить из сравнения" можно только один раз - добавили в сравнение без перезагрузки, а удаление уже с перезагрузкой. Тоже самое - удалили из сравнения без перезарузки, а добавить уже с перезагрузкой.
Не пойму в чём дело. Вроде всё по типовому.
Вот мой код:
объект в списке:
Код:

<div id="id-<?=$item['Message_ID'].$item['Class_ID'];?>"><?= $f_AdminButtons; ?>
<span id="item-<?=$item['Message_ID'].$item['Class_ID'];?>">
<span><?=$f_Name;?></span>
<div class="item-desc">
<div id="<?=$item['Message_ID'].$item['Class_ID'];?>">
<span id="fav_link<?=$item['Message_ID'].$item['Class_ID'];?>">
<?/*ссылка — переключить в избранном */?>
<? $is_in_fav_list = ($netshop->goodslist_favorite->check($item['Message_ID'], $item['Class_ID'])); ?>
<a class="link-favorite" <?=($is_in_fav_list ?"style=\"display:none;\"":NULL);?> id="fadd_<?=$item['Message_ID'].$item['Class_ID'];?>" href="<?= $netshop->goodslist_favorite->get_add_action_url($item['Message_ID'], $item['Class_ID'], $_SERVER['REQUEST_URI']); ?>" rel="nofollow" title="Добавить в избранные." >
Добавить в избранные
</a>
<a class="link-favorite" <?=($is_in_fav_list ?"":"style=\"display:none;\"");?> id="fdel_<?=$item['Message_ID'].$item['Class_ID'];?>" href="<?= $netshop->goodslist_favorite->get_remove_action_url($item['Message_ID'], $item['Class_ID'], $_SERVER['REQUEST_URI']); ?>" rel="nofollow" title="Уже в избранных. Удалить из избранного">
Удалить из избранных
</a>
</span>
</div>
</div>
</span>
</div>

суффикс:
Код:

<script>
$('.link-favorite').click(function(e){
var itemID =$(this).closest(".item-desc").find("div").attr("id");
e.preventDefault();
$.ajax({
url: $(this).attr('href'),
success: function(result){
$("#"+itemID).replaceWith($('#'+itemID, result));
}
})
});
</script>
198 196 2017-04-25 17:26:48 14407
Описание проекта