grid-view

3-ий вид, рабочий вариант

PHP:

// Product Grid
    $('#grid-view').click(function() {
        // What a shame bootstrap does not take into account dynamically loaded columns
        var cols = $('#column-right, #column-left').length;

        if (cols == 2) {
            $('#content .product-list').attr('class', 'product-layout product-grid col-lg-6 col-md-6 col-sm-12 col-xs-12');
        } else if (cols == 1) {
            $('#content .product-list').attr('class', 'product-layout product-grid col-lg-4 col-md-4 col-sm-6 col-xs-12');
        } else {
            $('#content .product-list').attr('class', 'product-layout product-grid col-lg-3 col-md-3 col-sm-6 col-xs-12');
        }
        $('#content .row.prod').removeClass('product-list-n');
        $('#list-view').removeClass('active');
        $('#price-view').removeClass('active');
        $('#grid-view').addClass('active');

        localStorage.setItem('display', 'grid');
    });
   
    // Product List
    $('#list-view').click(function() {
        $('#content .product-grid > .clearfix').remove();
        $('#content .row.prod').removeClass('product-list-n');
        $('#content .row > .product-layout').attr('class', 'product-layout product-list product-price col-xs-12');
        // $('#content .row > .product-grid').attr('class', 'product-layout product-list list col-xs-12');
        $('#content .product-layout').attr('class', 'product-layout product-list col-xs-12');
        // $('#price-view').removeClass('active');
        $('#grid-view').removeClass('active');
        $('#list-view').addClass('active');

        localStorage.setItem('display', 'list');
    });

    if (localStorage.getItem('display') == 'grid') {
        $('#list-view').removeClass('active');
        $('#price-view').removeClass('active');
        $('#grid-view').trigger('click');
        $('#grid-view').addClass('active');
    } else if (localStorage.getItem('display') == 'list'){
        $('#list-view').trigger('click');
        $('#list-view').addClass('active');
        $('#grid-view').removeClass('active');
    } else if(localStorage.getItem('display') == 'price'){
        $('#price-view').trigger('click');
        $('#grid-view').removeClass('active');
        $('#price-view').addClass('active');
       
        $('#content .row > .product-grid').attr('class', 'product-layout product-list list col-xs-12');
    };
   
   

    // if (localStorage.getItem('display') == 'list') {
        // $('#list-view').trigger('click');
        // $('#list-view').addClass('active');
    // } else if (localStorage.getItem('display') == 'grid'){
        // $('#grid-view').trigger('click');
        // $('#grid-view').addClass('active');
    // } else {
        // $('#price-view').trigger('click');
        // $('#price-view').addClass('active');
    // };
   
    // Product price
    $('#price-view').click(function() {
        // $('#content .product-grid > .clearfix').remove();
        $('#content .row.prod').attr('class', 'row prod product-list-n');
        $('#content .row > .product-layout').attr('class', 'product-layout product-list product-price col-xs-12');
        $('#grid-view').removeClass('active');
        $('#list-view').removeClass('active');
        $('#price-view').addClass('active');
       
        localStorage.setItem('display', 'price');

    });

   
    // if (localStorage.getItem('display') == 'price') {
        // $('#price-view').trigger('click');
        // $('#price-view').addClass('active');
    // } else if (localStorage.getItem('display') == 'grid'){
        // $('#grid-view').trigger('click');
        // $('#grid-view').addClass('active');
    // } else if(localStorage.getItem('display') == 'list'){
        // $('#list-view').trigger('click');
        // $('#list-view').addClass('active');
    // };
    // Checkout


В category.tpl

PHP:

            <button type="button" id="price-view" class="btn btn-default" data-toggle="tooltip" title="Прайс"><i class="fa fa-th-price"></i></button>