переключение list - grid

[Vasiy]

Надо чтобы было вот так:

[tigran]

Тогда нужно будет javascript функцию писать, чтобы переключать видимость блоков в шаблоне product-list.tpl. Просто добавить ссылку нельзя.

[Vasiy]

Они вроде и так переключаются надо просто добавить еще одно переключение.
В общем третье переключение работает но переключает не на карту, а опять на лист.

[Adik]

Они вроде и так переключаются надо просто добавить еще одно переключение.
В общем третье переключение работает но переключает не на карту, а опять на лист.

Значит ошибка в js коде переключателя. Что за код вы добавлили в файл global.js в function display(view)?

[Vasiy]

Да там в общем то интуитивно понятно:

Код: [Выделить]

$(document).off('mouseenter').on('mouseenter', '.product_list.grid.map li.ajax_block_product .product-container', function(e){


Код: [Выделить]


$(document).off('mouseleave').on('mouseleave', '.product_list.grid.map li.ajax_block_product .product-container', function(e){
типа так, потом третий блок:

Код: [Выделить]


$(document).on('click', '#grid', function(e){
e.preventDefault();
display('grid');
});

$(document).on('click', '#list', function(e){
e.preventDefault();
display('list');
});

$(document).on('click', '#map', function(e){
e.preventDefault();
display('map');
});
Далее надо бы вставить блок активации контейнера карты (3 контейнер) и вот здесь торможу:

Код: [Выделить]


else
{
$('ul.product_list').removeClass('list').addClass('map row');
$('.product_list > li').removeClass('col-xs-12').addClass('col-xs-12 col-sm-6 col-md-4');
$('.product_list > li').each(function(index, element) {
html = '';
html += '<div class="product-container">';
html += '<div class="left-block">' + $(element).find('.left-block').html() + '</div>';
html += '<div class="right-block">';
html += '<div class="product-flags">'+ $(element).find('.product-flags').html() + '</div>';
html += '<h5 itemprop="name">'+ $(element).find('h5').html() + '</h5>';
var rating = $(element).find('.comments_note').html(); // check : rating
if (rating != null) {
html += '<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating" class="comments_note">'+ rating + '</div>';
}
html += '<p itemprop="description" class="product-desc">'+ $(element).find('.product-desc').html() + '</p>';
var price = $(element).find('.content_price').html(); // check : catalog mode is enabled
if (price != null) {
html += '<div class="content_price">'+ price + '</div>';
}
html += '<div itemprop="offers" itemscope itemtype="http://schema.org/Offer" class="button-container">'+ $(element).find('.button-container').html() +'</div>';
var colorList = $(element).find('.color-list-container').html();
if (colorList != null) {
html += '<div class="color-list-container">'+ colorList +'</div>';
}
var availability = $(element).find('.availability').html(); // check : catalog mode is enabled
if (availability != null) {
html += '<span class="availability">'+ availability +'</span>';
}
html += '</div>';
html += '<div class="functional-buttons clearfix">' + $(element).find('.functional-buttons').html() + '</div>';
html += '</div>';
$(element).html(html);
});
$('.display').find('li#map').addClass('selected');
$('.display').find('li#list').removeAttr('class');
$('.display').find('li#grid').removeAttr('class');
$.totalStorage('display', 'map');
}
Кажется я как то сложно мыслю, должно быть как-то проще,
очистить окно от карточек товаров и легко вставить карту,
но не получается создать пустую страницу хедер, колонку
слева, футер, и в середину воткнуть скрипт.

[Mr.Sen]

Сложно это. Проще нужно.
- Блок с картой сразу заполняется при загрузке страницы, стили у него dispkay=none.
- На кнопку переключатель видимости блоков, который прячет grid и list (прверку, если уже спрятоно, то ничего не делать).
- В grid и list добавить прятанье блока map.