2

i am working on my MVCOnlineShop Project , i have shown categories on homepage by creating a partial view CategoryLayout.cshtml :

@model IEnumerable<MVCOnlineShop.Models.Category>
@{
    ViewBag.Title = "CategoryLayout";
}
<ul class="nav navbar-nav">
    @foreach (var Category in Model)
    {
        <li>
            @Html.ActionLink(Category.CategoryName,
"ProductList", new { Category = Category.CategoryName })
        </li>

</ul>

and added this in _Layout.cshtml:

@Html.Partial("CategoryLayout")

now i want to press on any category on the home page , and it will take me to products in such category , i have created this partial view ProductList.cshtml :

@model MVCOnlineShop.Models.Category

@{
    ViewBag.Title = "ProductList";
}
<ul>

    @foreach (var Product in Model.Products)
    {
        <li>
            @Html.ActionLink(Product.ProductName,
"Details", new { id = Product.CategoryID })
        </li>
    }
</ul>

and this is my HomeController :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MVCOnlineShop.Models;

namespace MVCOnlineShop.Controllers
{
    public class HomeController : Controller
    {
        OnlineStoreEntities storeDB = new OnlineStoreEntities();
        //
        // GET: /Home/

        public ActionResult Index()
        {
            var Categories = storeDB.Categories.ToList();
            return View(Categories);
        }
        //
        // GET: /Home/Browse
        public ActionResult Browse(string Category)
        {
            // Retrieve Category and its Associated Products from database
            var CategoryModel = storeDB.Categories.Include("Products")
                .Single(g => g.CategoryName == Category);

            return View(CategoryModel);
        }
        //
        // GET: /Home/Details
        public ActionResult Details(int id)
        {
            var Product = storeDB.Products.Find(id);

            return View(Product);
        }
        //
        // GET: /Home/Browse?Category=Games

        public ActionResult CategoryLayout()
        {
            var Categories = storeDB.Categories.ToList();
            return PartialView("CategoryLayout", Categories);
        }

    }
}

Question: How can i press on a category on the homepage , and this will take me to a page showing the products in this category, how can i do that?

Thanks in advance :)

Ahmad
  • 445
  • 5
  • 15
  • What issues you are facing with this code? – Chetan Jul 20 '17 at 11:41
  • You want to show the products of a particular category in the same page or in a new different page ? – Basanta Matia Jul 20 '17 at 11:42
  • in new different page @BasantaMatia – Ahmad Jul 20 '17 at 11:44
  • @ChetanRanpariya , no issues i have the categories on the homepage and its working , but just need to know how to link the products of each category to another page , so i can see on the other page the products of this category – Ahmad Jul 20 '17 at 11:45
  • Then why have you crated a partial view `ProductList.cshtml`. It should be a main view where you can show the products to a particular category. **And where is your action method to fetch Product for a Category ??** – Basanta Matia Jul 20 '17 at 11:46
  • yeah , i know there is something wrong , but can you please tell me what to do , i need codes please @BasantaMatia , i am a beginner in MVC – Ahmad Jul 20 '17 at 11:47
  • You want to display category name in the product list page? Then you need to send that information also as part of model to the view and write HTML to display that at appropriate place. – Chetan Jul 20 '17 at 11:48
  • i want to press for example on games on the home page , then this will take me to another page , where it says for example category games , and it shows the products under it @ChetanRanpariya , but i need some code please – Ahmad Jul 20 '17 at 11:54
  • Check my answer and let me know. – Basanta Matia Jul 20 '17 at 11:56

2 Answers2

1

Here we go :

First your action link should be :

<li> 
@Html.ActionLink(Category.CategoryName, 
"ProductList", new { CategoryId = Category.CategoryName }) 
</li>

And then you have to add ProductList action in your controller like :

public ActionResult ProductList(int? CategoryId)
{
     Category objCategory = new Category();

     objCategory.Products = storeDB.Products.where(m => m.CategoryId == CategoryId).ToList();

  return PartialView("ProductList", objCategory);
}

And your Product partial view Should be :

@model MVCOnlineShop.Models.Category 

@{ 
ViewBag.Title = "ProductList"; 
} 
<ul> 

@foreach (var Product in Model.Products) 
{ 
<li> 
@Html.ActionLink(Product.ProductName, 
"Details", new { id = Product.CategoryID }) 
</li> 
} 
</ul>

Cheers !!

Laxman Gite
  • 2,248
  • 2
  • 15
  • 23
0

Your action link is wrong. You need to call your Action method with parameter name, like,

 <li>
   @Html.ActionLink(Category.CategoryName,
      "MyProductDetails","YourControllerName", 
      new { id = Category.CategoryId })
 </li>

Note: You can change the Action method name in the above code. And insted of categoryName I'm passing id. But you can pass categoryName too. No issue.

Then in your Action Method,

 public ActionResult MyProductDetails(int? id) // If your id is not nullable then you can remove ? mark
  {
    List<ProductViewModel> Products = new List<ProductViewModel>();
    if(id!=null)   
    {
     Products = storeDB.Products.where(m=>m.categoryId == id).ToList(); // You can fetch the product as you like 
     return View(Products);
    }
    else
     return View(Products); // It will return null
  }

Then you can bind the data in your MyProductDetails view.

Hope it helps :)

Basanta Matia
  • 1,504
  • 3
  • 15
  • 27
  • i must add this action method for my product list partial view? @BasantaMatia – Ahmad Jul 20 '17 at 12:00
  • i got: Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. Exception Details: System.ArgumentException: The parameters dictionary contains a null entry for parameter 'id' of non-nullable type 'System.Int32' for method 'System.Web.Mvc.ActionResult ProductList(Int32)' in 'MVCOnlineShop.Controllers.HomeController'. An optional parameter must be a reference type, a nullable type, or be declared as an optional parameter. Parameter name: parameters – Ahmad Jul 20 '17 at 12:01
  • You need to write that action method in your **CategoryLayout.cshtml** partial view, the code you have posted in question. Do you have a id properties for categories or not ? You need to pass that here `@Html.ActionLink(Category.CategoryName, "MyProductDetails","YourControllerName", new { id = Category.CategoryId })` In place of **CategoryId** just write that. – Basanta Matia Jul 20 '17 at 12:04
  • how can you write an action result in a partial view?! – Ahmad Jul 20 '17 at 12:08
  • That's a basic thing. If your Categories Id field is nullable, then you need to add a **?** in your action method like `public ActionResult MyProductDetails(int? id)` – Basanta Matia Jul 20 '17 at 12:08
  • action result is always in controller , not in a partial view , right? – Ahmad Jul 20 '17 at 12:11
  • can you upvote this question so we can continue this discussion in chat , because i only have 19 reps , i need just 1 more rep so we can talk in chat – Ahmad Jul 20 '17 at 12:13
  • Action result is always in controller. Let's say in your home controller. Then in your action link you need to write home – Basanta Matia Jul 20 '17 at 12:16
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/149710/discussion-between-ahmad-and-basanta-matia). – Ahmad Jul 20 '17 at 12:17