'Uncaught DOMException: Failed to execute 'querySelector' on 'Document'| ASP.NET Core

I get the following error when I click on my links:

bootstrap.bundle.min.js:6 Uncaught DOMException: Failed to execute 'querySelector' on 'Document': '/Products/ShowProductByNavGroupId?navGroupId=5&title=%D9%BE%D9%88%D8%B3%D8%AA' is not a valid selector.

enter image description here

I don't know why I'm getting such an error! Here is the partial view named _Menu.cshtml which I have a navigation in:

@model Keyhanatr.Core.DTOs.Products.GroupsProductsViewModel
@foreach (var nav in Model.productNavGroups)
{
    <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle show" asp-controller="Products" asp-action="ShowProductByNavGroupId" asp-route-navGroupId="@nav.NavGroupId" asp-route-title="@nav.NavTitle" data-bs-toggle="dropdown" aria-expanded="true">@nav.NavTitle</a>
        @if (Model.ProductGroups.Any(g => g.ProductNavGroupId == nav.NavGroupId))
        {
            <div class="dropdown-menu p-0 show">
                @foreach (var group in Model.ProductGroups.Where(g => g.ProductNavGroupId == nav.NavGroupId))
                {.
                 .
                 .
}

When I click on the <a> with nav-link dropdown-toggle show class, nothing happens, and when I take a look at console section of my inspect, I'll see the error which I mentiond above! Can anyone help?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source