Entity;
    public class Category
    {
        [Key]
        [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
        public int categoryID { get; set; }
        public string Name { get; set; }
        public string Description { get; set; }
    }

 public class SubCategory
    {
        [Key]
        [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
        public int subCategoryID { get; set; }
        public string Name { get; set; }
        public string Description { get; set; }
        public int CategoryID{ get; set; }
    }

 Models ;
     public class CategoryModel
        {
            public List<Entity.Category> Categories { get; set; }
            public List<SubCategory> SubCategories { get; set; }
        }
Controller ;
 public IActionResult Index()
        {
            var categories = _adminService.GetAllCategory();
           

            var subcategories = _adminService.GetAllSubCategories();
           
            var entity = new CategoryModel()
            {
                Categories = categories,
                SubCategories = subcategories
            };
      return View(entity);
}


View; 
           @{
                                
                                    foreach (var category in Model.Categories)
                                    {   

                                        @Html.Hidden("catID",category.categoryID)
                                        <a href="#">@category.Name <i class="fa fa-angle-right" aria-hidden="true"></i></a>
                                        <ul class="sub-category">
                                            @foreach (var subcategory in Model.SubCategories)
                                            {
                                              @if (subcategory.CategoryID == category.categoryID)
                                                {
                                                    <li><a href="@subcategory.subCategoryID">@subcategory.Name</a></li>
                                                }

                                            }
                                        </ul>
                                    }
                                }

Can you explain how i can show the categories in the menu on the view side? I can shoot categories, but I have trouble shooting subcategories. I shared the database schemes above. I will show it as a drop down menu in the menu.I think there is a problem in the if part.

*

CodePudding user response：

Your subcategories has data? Does this work?

foreach (var category in Model.Categories)
{
    @Html.Hidden("catID",category.categoryID)
    <a href="#">@category.Name <i class="fa fa-angle-right" aria-hidden="true"></i></a>
    @{
        if (Model.SubCategories != null && Model.SubCategories.Any())
        {
            var subCategories = Model.SubCategories.Where(x => x.CategoryID == category.categoryID).ToList();
            if (subCategories != null && subCategories.Any())
            {
                <ul class="sub-category">
                @foreach (var subcategory in subCategories)
                {
                    <li><a href="@subcategory.subCategoryID">@subcategory.Name</a></li>
                }
                </ul>
            }
        }
    }
}

CodePudding user response：

So you are going to implement a Multi-Level Dropdowns? I made an example based on your codes.

Controller:

public IActionResult Index()
{
    var categories = new List<Category>
    {
        new Category{ Name = "C1", categoryID = 1,},
        new Category{ Name = "C2", categoryID = 2,},
        new Category{ Name = "C3", categoryID = 3,}
    };


    var subcategories = new List<SubCategory>
    {
        new SubCategory{ Name = "S1", subCategoryID = 1, CategoryID = 1 },
        new SubCategory{ Name = "S2", subCategoryID = 2, CategoryID = 1 },
        new SubCategory{ Name = "S3", subCategoryID = 3, CategoryID = 1 },
        new SubCategory{ Name = "S4", subCategoryID = 4, CategoryID = 2 },
        new SubCategory{ Name = "S5", subCategoryID = 5, CategoryID = 2 },
        new SubCategory{ Name = "S6", subCategoryID = 6, CategoryID = 3 }
    };

    var entity = new CategoryModel()
    {
        Categories = categories,
        SubCategories = subcategories
    };
    return View(entity);
}

View:

@model CategoryModel
<style>
    .dropdown-submenu {
        position: relative;
    }
    .dropdown-submenu .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: -1px;
    }
</style>
<div class="dropdown">
    <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        Menu
    </button>
    <ul class="dropdown-menu">
        @foreach (var category in Model.Categories)
        {
            <li class="dropdown-submenu">
                @Html.Hidden("catID", category.categoryID)
                <a class="test dropdown-item" tabindex="-1" href="#">@category.Name</a>
                <ul class="dropdown-menu">
                    @foreach (var subcategory in Model.SubCategories)
                    {
                        @if (subcategory.CategoryID == category.categoryID)
                        {
                            <li><a class="dropdown-item" href="@subcategory.subCategoryID">@subcategory.Name</a></li>
                        }
                    }
                </ul>
            </li>
        }
    </ul>
</div>

@section scripts{
    <script>
        $(document).ready(function () {
            $('.dropdown-submenu a.test').on("click", function (e) {
                $(this).next('ul').toggle();
                e.stopPropagation();
                e.preventDefault();
            });
        });
    </script>
}

Result: