еще можно переключать не через JS а через вид отображения - возможно так будет проще, а то без умных мыслей передирать чужой код - нехорошо...
/?view=table
/?view=price
можно как GET параметр и потом его обработать в шаблоне категории
PHP:
if ( $_GET['view'] == 'table') { /*вывод для таблицы*/ } else if ( $_GET['view'] == 'price') { /*вывод для прайса*/ }
или создать соотв. шаблоны с именами как в параметре передаваемом (где-то такое видел) - они подгружались автоматом...
ну и закрыть такие линки в роботс чтоб не плодить дубли
Сейчас вот делаю смену вывода товаров с вида "один товар в строке" на "таблица 3 товара в строке", делаю через JS
Вверх страницы вставил мой селектор
Код:
<div class="catalog-item-view">
<a title="Список" id="change-list" class="list selected" href="#" onclick="return false;"></a>
<a title="Таблица" id="change-table" class="table" href="#" onclick="return false;"></a>
</div>
шаблон категории отдает разметку всю как для вида "Список".
Клики обрабатываю на jquery
Код:
$('#change-list').click(function() {
display('list');
});
$('#change-table').click(function() {
display('grid');
});
Далее ввел функцию display(view) на JS - обработчик того что надо делать с хтмл-ом
полный текст ее приводить нет смысла, скажу только что лучше всего сразу сделать верстку так чтоб добавлением класса весь вид менялся, и не нужно было модифицировать DOM - если вы будете перемещать блок где кнопка "купить" - нужно делать реинициализацию скриптов повешенных на нее- я взял код от разработчика плагина аякс-фильтра )))
Код:
SqueezeBox.assign($$('a.modal'), {parse: 'rel'});
jQuery(document).ready(function($) {
$('.orderlist-container').hover(
function() { $(this).find('.order-list').stop().show()},
function() { $(this).find('.order-list').stop().hide()}
);
Virtuemart.product($("form.product"));
$("form.js-recalculate").each(function(){
if ($(this).find(".product-fields").length) {
var id= $(this).find('input[name="virtuemart_product_id[]"]').val();
Virtuemart.setproducttype($(this),id);
}
});
});
в ней меняю хтмл код "налету", и пишу в куки выбранное состояние:
$.cookie('display', 'list');
или
$.cookie('display', 'grid');
А потом запихал код
Код:
view = $.cookie('display');
if (view) {
display(view);
} else {
display('list');
}
для проверки какой вид выбрал пользователь, и грузим его при обновлении страницы или переходе по магазину. Для использования метода $.cookie надо подгрузить библиотеку jquery.cookie.js
