asp.net-mvc - ASP.NET MVC 从 IEnumerable 类型呈现部分视图IEnumerable 类型的内部视图

Question

编辑：产品视图包含一些产品，所以我尝试使用每个产品的按钮将它们一一添加到购物车，添加的产品应出现在部分视图（购物车）的表格中，它工作正常，我现在正在尝试在弹出模式中呈现此购物车，因此当我按下弹出按钮时，它应该显示我添加了哪些产品，而我仍在产品视图中。

我试图在模态体内做这样的事情：

@Html.Partial("_ShowCart", new List<InternetApp.Models.Cart>())

但这会检索一个空列表。

所以我想要这样的东西，但我不知道如何使用不同的模型来做到这一点：

@Html.Partial("_ShowCart", Model)

我有 3 个模型：产品、购物车和视图模型：

public class Product
{
    public int id { get; set; }
    public String name { get; set; }
    public float price { get; set; }
    public String image { get; set; }
    public String description { get; set; }
    public int? CategoryId { get; set; }
}

public class Cart
{
    public int product_id { get; set; }
    public DateTime added_at { get; set; }
    public virtual Product product { get; set; }
}

public class ProductCart
{
    public Product Product { get; set; }
    public Cart Cart { get; set; }
}

购物车和产品每个都有控制器，我将购物车作为部分视图，其中IEnumerable<Cart>包含IEnumerable<Product>.

这是购物车索引操作

public ActionResult Index()
{
    List<Cart> Cart = db.Cart.Include(a => a.product).ToList();
    return PartialView("_ShowCart", Cart);
}

我不知道如何在产品中渲染购物车，因为每个人都有不同的IEnumerable模型......

标签： asp.net-mvcasp.net-mvc-4partial-viewsasp.net-mvc-partialview

Answer 1

您的实体框架 (EF) 模型如下所示。我仅出于建议的标准化和清晰目的而进行了修改：

public class Product
{
    [Key] //This is only needed by EF if you don't call the primary key "Id".
    public int Id { get; set; }
    public String Name { get; set; }
    public float Price { get; set; }
    public String Image { get; set; }
    public String Description { get; set; }
    //Add any additional properties.
}

public class Cart
{
    [Key]
    public int Id { get; set; }
    //Add any additional properties
}

public class CartProduct
{
    [Key]
    public int Id { get; set; }
    public int CartId {get; set; } //References Id property in Cart entity.
    public int ProductId {get; set; } //References Id property in Product entity.
    public DateTime AddedAt { get; set; }

    //These are navigation properties.  
    //The foreign key attribute lets EF know what property to reference
    [ForeignKey("CartId")]
    public virtual Cart Cart { get; set; }

    [ForeignKey("ProductId")]
    public virtual Product Product { get; set; }
}

您应该创建一组单独的模型。EF 模型应仅用于表示您的数据库表和属性。将这些模型与您的 EF 模型分开放置......也许是一个 ViewModel 文件夹。

    public class CartProductsViewModel
    {
        public int CartId { get; set; } //Persist the cart you are adding to.
        public IEnumerable<ProductModel> Products {get; set; } //Available products

        public class ProductModel
        {
            public int Id { get; set; }
            public String Name { get; set; }
            public float Price { get; set; }
            public String Image { get; set; }
            public String Description { get; set; }
            //Add any additional properties.
         }

    }

现在您可以拥有一个控制器和一个视图。

public ActionResult Index(int cartId) //passing cartId for cart you are working with.
{
    var viewModel = new CartProductsViwModel();

    viewModel.CartId = cartId;
    //Get available products that you can add to cart.
    viewModel.Products = db.Products //pluralized in DbSet in EF context.
                  .Select(p => new ProductModel
                     { 
                        Id = p.Id,
                        Name p.Name,
                        Price = p.Price,
                        Image = p.Image
                        Description = p.Description
                     });

    return View(viewModel);  
}

In the return, I am not specifying the viewModel name. This is only made possible if you follow MVC guidelines and name the view the same name as the method calling, in this case index.cshtml. And also add following to top:

@model CartProductsViwModel //may need to be fully qualified (add namespace).

You should be able to loop through the Products in this model to show in table. This avoids having to deal with a separate product and cart view. As far as adding the product to the view, this can be done on the client-side. I would suggest to try to get this working first, and then you can create a new question dedicated to the client-side work.

If you really need a dialog, you can look up JQuery dialogs. JQuery UI dialog

You will then need to perform ajax calls to post the added product and the cartId. The method will be something like this.

[HttpPost]
public JsonResult AddProductToCart(int cartId, ProductModel product) {}

That would also be a separate question. I hope this helps get you started.