What is the easiest way to get the Products of a SubCategory to show on a top level Category page?

I have a layout I am trying to accomplish.

I see how to get the SubCategories in the Category View. But what is the easiest way to display the products PER category on the top level or at least one level up.

Example category page:

Top Level Category
- Sub Category 1
   --Show Products of sub category in a @foreach to order the sub category products by sub category.
- Sub Category 2
   --Show Products of sub category in a @foreach to order the sub category products by sub category.

Does that make sense?


This is the current Product NopCommerce Category View code for subcategories. It lists the SubCategories BUT it does not list the Products under those SubCategories.

@foreach (var item in Model.SubCategories)
                    {
                        <div class="item-box">
                            <div class="sub-category-item">
                                <h2 class="title">
                                    <a href="@Url.RouteUrl("Category", new { SeName = item.SeName })" title="@item.PictureModel.Title">
                                        @item.Name
                                    </a>
                                </h2>
                               <!--WHAT I WANT TO DO-->
                             <!--I want to list all the products in the sub category here-->


                            </div>
                        </div>
                    }

While not recommended to be done directly to Views, this is what you can do to get things done. :)

var productService = Nop.Core.Infrastructure.EngineContext.Current.Resolve<Nop.Services.Catalog.IProductService>();
var children = productService.SearchProducts(0, 10, new List<int>() { item.Id });
@foreach (var child in children)
{
    <div>YOUR_HTML_HERE</div>
}

wooncherk wrote:



@wooncherk,

I have been looking for this solution for weeks!!!  This is phenomenal!  I really appreciate the solution. Even if in the view, I will probably move it.  But either way.  This is great!

Glad it helped! :D

@wooncherk,

So that got me the access to the names and such.
How would I now get access to the product URL and picture?  



Thanks again.

At the top of your View:

@using Nop.Services.Localization;

Then the actual code:

var productService = Nop.Core.Infrastructure.EngineContext.Current.Resolve<Nop.Services.Catalog.IProductService>();
var pictureService = Nop.Core.Infrastructure.EngineContext.Current.Resolve<Nop.Services.Media.IPictureService>();
var children = productService.SearchProducts(0, 10, new List<int>() { item.Id });
@foreach (var child in children)
{
    <span>URL: @Url.RouteUrl("Category", new { SeName = child.GetSeName() })</span>
    <span>Name: @child.GetLocalized(z => z.Name)</span>

    var picture = pictureService.GetPicturesByProductId(child.Id, 1).FirstOrDefault();
    if (picture != null)
    {
        <span>Picture: @pictureService.GetPictureUrl(picture.Id, 200)</span> <!-- 200 is px -->
    }
}

wooncherk wrote:


That was it!!!
Missed a using '@using Nop.Services.Seo' for the GetSeName(), but that was it.  Thank you so much.

Works for nopCommerce 4.0

There is no need to change Nop.Web\Themes\YourTheme\Views\Catalog\CategoryTemplate.ProductsInGridOrLines.cshtml
It's configurable via settings. So you can do it via Admin section or directly via DB.

Display products from sub-categories:

UPDATE Setting SET Value = 1 WHERE Name = 'catalogsettings.showproductsfromsubcategories';

Display number of products for each category:

UPDATE [Setting] SET Value = 1 WHERE Name = 'catalogsettings.showcategoryproductnumber';

Display number of products for each category including sub-categories:

UPDATE [Setting] SET Value = 1 WHERE Name = 'catalogsettings.showcategoryproductnumberincludingsubcategories';