[Solved] ASP.Net MVC Error: The model item passed into the dictionary is of type ProducDtltViewModels, but this dictionary requires a model item of type HomeViewModels

Hi All,

I am facing error when i click on Product to check product details shows below error.

The model item passed into the dictionary is of type 'Ecommerce_EF_DB_18May21.ViewModels.ProducDtltViewModels', but this dictionary requires a model item of type 'Ecommerce_EF_DB_18May21.ViewModels.HomeViewModels'.

I am working with viewModels here is below codes step by step.

Products Home Page Code

@model Ecommerce_EF_DB_18May21.ViewModels.HomeViewModels

<section class="flat-row row-product-project style-1">
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="title-section margin-bottom-41">
                    <h2 class="title">Best Sale</h2>
                </div>
                <!--Searching Input Start-->
                <div>
                    <form method="post" action="/Home/Index">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <div class="input-group" style="margin-left:300px;">
                                        <span class="input-group-addon"><i class="fa fa-search"></i></span>
                                        <input type="text" id="Search" placeholder="Search" class="form-control" />
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <!--Searching Input End-->
                <div>
                </div>

                @{Html.RenderAction("Products", "Widgets", new { isLatestProducts = false });}
            </div>
        </div>
    </div>
</section>

Product Index Controller Code:

Creating Widgets controller 

    public class WidgetsController : Controller
    {
        // GET: Widgets
        public ActionResult Products(bool isLatestProducts, int? CategoryID = 0)
        {
            ProductsWidgetsViewModels model = new ProductsWidgetsViewModels();
            model.IsLatestProducts = isLatestProducts;
            if (isLatestProducts)
            {
                model.Products = ProductsService.Instance.GetLatestProducts(4);
            }
            else if (CategoryID.HasValue && CategoryID > 0)
            {
                model.Products = ProductsService.Instance.GetProductsByCategory(CategoryID.Value, 4);
            }
            else
            {
                model.Products = ProductsService.Instance.GetProducts(1, 100);
            }
            return PartialView(model);
        }
    }

ViewModel Class "ProductsWidgetsViewModels"

    public class ProductsWidgetsViewModels
    {
        public List<Tbl_Product> Products { get; set; }

        public bool IsLatestProducts { get; set; }
    }

Widget Controller Product Action Result Html Page Code:

@model Ecommerce_EF_DB_18May21.ViewModels.ProductsWidgetsViewModels

@{
    var defaultImageURL = "/Content/images/placeholder-image.png";
}

@if (Model != null && Model.Products != null)
{
    if (!Model.IsLatestProducts)
    {
        <ul class="flat-filter style-1 text-center max-width-250 clearfix">
            <li class="active"><a href="#" data-filter="*">All Product</a></li>
            @foreach (var category in Model.Products.Select(x => x.Tbl_Category).ToList().Distinct())
            {
                <li><a href="#" data-filter=".@category.CategoryName.ToLower()">@category.CategoryName</a></li>
            }
        </ul>

    }
    <div class="divider h54"></div>
    <div class="product-content product-fourcolumn clearfix">
        <ul class="product style2 isotope-product clearfix">
            @foreach (var product in Model.Products)
                {
                    var ImageURL = string.IsNullOrEmpty(product.ImageURL) ? defaultImageURL : product.ImageURL;

                <li class="product-item @product.Tbl_Category.CategoryName.ToLower()">
                    <div class="product-thumb clearfix">
                        <a href="@Url.Action("Details","Product", new { id = product.ProductId})" class="product-thumb">
                            <img src=@ImageURL style="height:300px; width:250px;"  alt="image">
                        </a>
                        @if (Model.IsLatestProducts)
                        {
                            <span class="new">New</span>
                        }
                    </div>
                    <br />
                    <div class="product-info text-center clearfix">
                        <span class="product-title">@product.ProductName</span>
                        <div class="price">
                            <ins>
                                <span class="amount">Price: @product.Price PKR</span>
                            </ins>
                        </div>
                        @*<ul class="flat-color-list width-14">
                                <li>
                                    <a href="#" class="red"></a>
                                </li>
                                <li>
                                    <a href="#" class="blue"></a>
                                </li>
                                <li>
                                    <a href="#" class="black"></a>
                                </li>
                            </ul>*@
                    </div>
                    <div class="add-to-cart text-center">
                        <a href="#">ADD TO CART</a>
                    </div>
                    <a href="#" class="like"><i class="fa fa-heart-o"></i></a>
                </li>
            }
        </ul>
    </div>
}