[Solved] Gridview and Listview Display At Same Time

[apislerr]

Im using prestashop 1.6.0.9.
i make root category for product

 

Product

- category 1

- category 2

- category 3

 

After view product in category 1 it display well product list with grid view or list view

then, after view root product it display sub category

- category 1

- category 2

- category 3

 

but it display product list in  grid view and list view at the same time. how to fix that or how to remove product list from the root product?

 

 

 

Edited October 17, 2014 by apislerr (see edit history)

[DrunkBug]

Can you give a link to your website or a screenshot of what you are talking about? Because I can hardly imagine what you mean.

[apislerr]

Can you give a link to your website or a screenshot of what you are talking about? Because I can hardly imagine what you mean.

http://goo.gl/ifBd7B

[DrunkBug]

I viewed your source code of that page, you are mising semicolon ( ; ) at line 160, in your javascript.

Edited October 15, 2014 by DrunkBug (see edit history)

[apislerr]

I viewed your source code of that page, you are mising semicolon ( ; ) at line 160, in your javascript.

what javascript?

[DrunkBug]

what javascript?

As I said, view source on your browser and the semicolon will be missing at line 160. It's embeded in html, not in external .js file. This is that part:

<script type="text/javascript">
                    jQuery(document).ready(function($){
                    
                    $(".category-products .grid").click(function(e) {
                    $("#products_wrapper ol.products-list").hide();
                    $("#products_wrapper ul.products-grid").show();
                    $('.category-products .list').removeClass('list-mode-active');
                    $(this).addClass('grid-mode-active');
                    e.preventDefault();
                });
   

                $(".category-products .list").click(function(e) {
                $("#products_wrapper ol.products-list").show();
                $("#products_wrapper ul.products-grid").hide();
                $(this).addClass('list-mode-active');
                $('.category-products  .grid').removeClass('grid-mode-active');
                e.preventDefault(); });

        

})
   
 
jQuery(document).ready(function($){
$("#products_wrapper ol.products-list").hide();
$("#products_wrapper ul.products-grid").show();
$('.category-products .list').removeClass('list-mode-active');
$('.category-products .grid').addClass('grid-mode-active');
});
    
 </script>

It should be:

<script type="text/javascript">
                    jQuery(document).ready(function($){
                    
                    $(".category-products .grid").click(function(e) {
                    $("#products_wrapper ol.products-list").hide();
                    $("#products_wrapper ul.products-grid").show();
                    $('.category-products .list').removeClass('list-mode-active');
                    $(this).addClass('grid-mode-active');
                    e.preventDefault();
                });
   

                $(".category-products .list").click(function(e) {
                $("#products_wrapper ol.products-list").show();
                $("#products_wrapper ul.products-grid").hide();
                $(this).addClass('list-mode-active');
                $('.category-products  .grid').removeClass('grid-mode-active');
                e.preventDefault(); });

        

});
   
 
jQuery(document).ready(function($){
$("#products_wrapper ol.products-list").hide();
$("#products_wrapper ul.products-grid").show();
$('.category-products .list').removeClass('list-mode-active');
$('.category-products .grid').addClass('grid-mode-active');
});
    
 </script>

[apislerr]

 

As I said, view source on your browser and the semicolon will be missing at line 160. It's embeded in html, not in external .js file. This is that part:

<script type="text/javascript">
                    jQuery(document).ready(function($){
                    
                    $(".category-products .grid").click(function(e) {
                    $("#products_wrapper ol.products-list").hide();
                    $("#products_wrapper ul.products-grid").show();
                    $('.category-products .list').removeClass('list-mode-active');
                    $(this).addClass('grid-mode-active');
                    e.preventDefault();
                });
   

                $(".category-products .list").click(function(e) {
                $("#products_wrapper ol.products-list").show();
                $("#products_wrapper ul.products-grid").hide();
                $(this).addClass('list-mode-active');
                $('.category-products  .grid').removeClass('grid-mode-active');
                e.preventDefault(); });

        

})
   
 
jQuery(document).ready(function($){
$("#products_wrapper ol.products-list").hide();
$("#products_wrapper ul.products-grid").show();
$('.category-products .list').removeClass('list-mode-active');
$('.category-products .grid').addClass('grid-mode-active');
});
    
 </script>

It should be:

<script type="text/javascript">
                    jQuery(document).ready(function($){
                    
                    $(".category-products .grid").click(function(e) {
                    $("#products_wrapper ol.products-list").hide();
                    $("#products_wrapper ul.products-grid").show();
                    $('.category-products .list').removeClass('list-mode-active');
                    $(this).addClass('grid-mode-active');
                    e.preventDefault();
                });
   

                $(".category-products .list").click(function(e) {
                $("#products_wrapper ol.products-list").show();
                $("#products_wrapper ul.products-grid").hide();
                $(this).addClass('list-mode-active');
                $('.category-products  .grid').removeClass('grid-mode-active');
                e.preventDefault(); });

        

});
   
 
jQuery(document).ready(function($){
$("#products_wrapper ol.products-list").hide();
$("#products_wrapper ul.products-grid").show();
$('.category-products .list').removeClass('list-mode-active');
$('.category-products .grid').addClass('grid-mode-active');
});
    
 </script>

i dont know what file name that have this js

[DrunkBug]

It should be header.tpl file in your themes folder.

[apislerr]

It should be header.tpl file in your themes folder.

nothing changes, clear cache. nothing changes

[DrunkBug]

Remove this javascript from header.tpl file and put it in footer.tpl file. Looks like now the javascript part is good, just it doesn't execute at $(document).ready() event. Maybe putting it to the bottom of your page (in footer.tpl) will solve your problem. Give it a try.

[apislerr]

Remove this javascript from header.tpl file and put it in footer.tpl file. Looks like now the javascript part is good, just it doesn't execute at $(document).ready() event. Maybe putting it to the bottom of your page (in footer.tpl) will solve your problem. Give it a try.

look same

[DrunkBug]

The problem is that $(document).ready() isn't executed. Sometimes, it helps to put all javascript files and then all javascript code to the end of file, sometimes some other modules causes this problem. But it's hard to debug your javascript code without having access to your files.

[apislerr]

The problem is that $(document).ready() isn't executed. Sometimes, it helps to put all javascript files and then all javascript code to the end of file, sometimes some other modules causes this problem. But it's hard to debug your javascript code without having access to your files.

but, why it looks fine when i view subcagetory?

[DrunkBug]

Could you try to disable blocklayered and see if it works then?

[apislerr]

Could you try to disable blocklayered and see if it works then?

tq2