Loading the page failed.

Ok... I figured out the second issue.... sort of.   This is more an issue with the
~/Views/Catalog/CategoryTemplate.ProductsInGridOrLines.cshtml

It only show products and the container <div> (product-list,  product-grid) when there are products assigned to that category.  So I need to make some adjustments.

Is there any documentation on the javascript processes?  

Specifically, I'm looking for how it populates the divs (product-list,  product-grid).  

I want to hide the sub-category-grid <div> when the filter returns results and show it again when all filters are cleared.

No sure which js include file and function(s) to look for.


Thanks again for all your help and patience.

Hi mstuart,

Sure you can do whatever changes you need in the Filters but please refer to the documentation and especially  the various selectors as they need to match your Html structure (if you make any changes to it).
About the subcategories and the Filters - there are two settings a nopCommerce one and one for the Ajax Filters. The nopCommerce one has nothing to do with the Filters and it basically says whether to show the products from the subcategories along with images of the subcategories themselve, which are always shown by default. If you enable this setting you will probably want to enable the same setting in the Ajax Filters, so that they can filter on the same set of products. But there is one important thing to note: The Ajax Filters will operate only on the products in the immediate subcategories and not in the next levels under them.  

You can hook to the Ajax Filter filtration completed event. Here is a sample code:

<script type="text/javascript">

$(document).on("nopAjaxFiltersFiltrationCompleteEvent", function () {
Add you logic here
});
</script>

Hope this helps!

Great!  Thank you!

Awesome Support!

Here are the steps I have taken that have resulted in the error message "Loading the page failed."


1) Fresh install of nopCommerce. (Using sample data)

2) Set nopCommerce Catalog setting > Include products from subcategories: (checked)

3) Installed NopAjaxFilters

4) Set NopAjaxFilters setting > Include Products From Subcategories: (checked)


Using DefaultClean theme...

5) Copy ~/Views/Shared/_ColumnsThree.cshtml over to ~/Themes/DefaultClean/Views/Shared/

6) Rename ~/Themes/DefaultClean/Views/Shared/_ColumnsThree.cshtml  to ~/Themes/DefaultClean/Views/Shared/_ColumnsThreeFilters.cshtml

7) In ~/Themes/DefaultClean/Views/Shared/_ColumnsThreeFilters.cshtml,
place widget @Html.Widget("NopAjaxFilters") in the <div class="rightside-3"> tag.   (This puts the filters on the right side of the page)

8) Create a new folder called "Catalog" in ~/Themes/DefaultClean/Views/

9) Copy ~/Views/Catalog/CategoryTemplate.ProductsInGridOrLines.cshtml over to ~/Themes/DefaultClean/Views/Catalog/

10) Rename ~/Themes/DefaultClean/Views/Catalog/CategoryTemplate.ProductsInGridOrLines.cshtml to ~/Themes/DefaultClean/Views/Catalog/CategoryTemplate.ProductsInGridOrLinesFilters.cshtml

11) Edit  ~/Themes/DefaultClean/Views/Catalog/CategoryTemplate.ProductsInGridOrLinesFilters.cshtml
Change the Layout from:

Layout = "~/Views/Shared/_ColumnsThree.cshtml";
to
Layout = "~/Themes/DefaultClean/Views/Shared/_ColumnsThreeFilters.cshtml";

12) Create new record in nopCommerce DB table [CategoryTemplate]

Name = 'Products In Grid Or Lines w/ Filters'
ViewPath = 'CategoryTemplate.ProductsInGridOrLinesFilters'
DisplayOrder = 2

13) In nopCommerce settings > Catalog > Categories: edit a category that contains subcategories.  Select the Category template "Products In Grid Or Lines w/ Filters" in the dropdown.  Save Category.

14) Browse to category w/ filter.  Click on a filter item.  Receive the error message.


Do you see anything wrong with the above steps?

Would you mind trying to do the steps and see if you receive the same error message "Loading the page failed."?

Hi mstuart,

The Ajax Filters use the same category template as the current category. So if your category template is this one CategoryTemplate.ProductsInGridOrLinesFilters.cshtml then you need to have  the same template for the Ajax Filters.
You have to copy and rename the template below to match the name of your category template:
Plugins\SevenSpikes.Nop.AjaxFilters\Views\Catalog7Spikes\CategoryTemplate.ProductsInGridOrLines.cshtml

Then the filters will find the correct template and use it.

Thanks

Ah HA!!!   That fixed it.

Thanks so much for all your help!!!

After adding the template "New Template" at the Catalog7Spikes, it does not work.

In my case:
(1) Added "CategoryTemplate.ProductsInGridOrLines_NEW" at the {THEME}/views. (Theme: Brooklyn);
(2) Added the new template record by the Admin Panel (Configure > Templates > Category Template);
(3) Copy the template files "ajaxfilters/views/Catalog7Spikes/CategoryTemplate.ProductsInGridOrLines.cshtml" and "ajaxfilters/views/Catalog7Spikes/_AjaxFIlters.ProductsInGridOrLines.cshtml"
(4) Rename the new template: "CategoryTemplate.ProductsInGridOrLines_NEW" and "_AjaxFIlters.ProductsInGridOrLines_NEW"
(5) Select one category like "Computer", change the category template to "CategoryTemplate.ProductsInGridOrLines_NEW";
(6) Save

Please advice

Sorry, my fault. It works, but there is another problem. Please redirect to https://www.nop-templates.com/boards/topic/3346/fixed-viewmode