使用按钮从视图中调用httppost的ActionResult [英] Calling httppost actionresult from inside a view using a button

问题描述

我有一个项目使用数据库，使用户之间的在线商店（发布一个产品，购买等）。在这个项目中我有一个名为我的购物的观点：

I have a project to make an online shop between users (post a product, buy, etc.) using a database. In this project I have a view called "ShoppingCart":

@model IEnumerable<MyFirstProject.Models.Product>

@{
    ViewBag.Title = "ShoppingCart";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Your Shopping Cart</h2>



@if (Model == null)
{
    <div style="float:left">Your cart is empty.</div>
    <div>
        Total payment: 0
    </div>
}
else
{
    decimal tPrice = 0;
    <div>
    <table style="float:left">
        @foreach (var product in Model)
        {
            tPrice = tPrice + product.Price;
            { Html.RenderPartial("ProductLine", product);}
        }
    </table>
        </div>
    <div>
        Total payment: @tPrice
    </div>
}

它接收的产品的列表，用户决定购买，并显示它们（不是重要的部分）。我需要添加一个按钮，将列表发送到行动的结果，在ShoppingController

It receives a list of products which the user decided to buy and displays them (not the important part). I need to add a button which will send the list to an action result in the "ShoppingController":

[HttpPost]
        public ActionResult ShoppingCart(List<Product> bought)
        {
            if (ModelState.IsValid)
            {
                foreach (var listP in bought.ToList())
                {
                    foreach (var databaseP in db.Products.ToList())
                    {
                        if (listP.ProductID == databaseP.ProductID)
                        {
                            databaseP.State = 1;
                            db.SaveChanges();
                            break;
                        }
                    }
                }
                return RedirectToAction("Index");
            }

            else
            {
                return View(bought);
            }
        }

国家表示，如果该产品是买还是不（0 =不买，1 =买），db是数据库

"State" indicates if the product was bought or not (0=not bought, 1=bought), db is the database

推荐答案

如果您wan't从视图的操作方法张贴任何数据，你应该保持在表单元素的数据，并保持在一种形式。既然你要发布项目的集合，你可以使用编辑模板

If you wan't to post any data from a view to an action method, you should keep that data in form elements and keep that in a form. Since you want to post a collection of items, You may use Editor Templates.

让我们创建一个视图模型开始。

Let's start by creating a view model.

public class ShoppingCartViewModel
{
    public decimal TotalPrice { set; get; }
    public List<Product> CartItems { set; get; }
}

public class Product
{
    public int Id { set; get; }
    public string Name { set; get; }
}

现在在你付诸行动，将创建的对象的 ShoppingCartViewModel ，加载 CartItems 财产和发送到视图。

Now in your GET action, you will create an object of the ShoppingCartViewModel, load the CartItems property and send to the view.

public ActionResult Index()
{
    var cart = new ShoppingCartViewModel
    {
        CartItems = new List<Product>
        {
            new Product   { Id = 1, Name = "Iphone" },
            new Product   { Id = 3, Name = "MacBookPro" }
        },
        TotalPrice = 3234.95
    };
    return View(cart);
}

现在我将创建一个EditorTemplate。要做到这一点，转到您的〜/查看/ YourControllerName 文件夹，并创建一个名为 EditorTemplates 并添加视图一个名为 Product.cshtml

Now i will create an EditorTemplate. To do that, Go to your ~/Views/YourControllerName folder, and Create a directory called EditorTemplates and add a view with name Product.cshtml

的文件的名称应与该类型的名称。的

打开这个新的视图，并添加下面的code。

Open this new view and add the below code.

@model YourNamespace.Product
<div>
    <h4>@Model.Name</h4>
    @Html.HiddenFor(s=>s.Id)
</div>

您可以保留，但是你想显示。但重要的是，我们需要保持一个表单产品ID。我们保持在一个隐藏字段在这里。

You can keep the display however you want. But the important thing is, We need to keep a form field for the productId. We are keeping that in a hidden field here.

现在让我们回到我们的主要观点。我们需要让这种观点强类型我们的 ShoppingCartViewModel 。我们将使用 EditorFor HTML辅助方法，在此视图中拨打我们的编辑模板

Now let's go back to our main view. We need to make this view strongly typed to our ShoppingCartViewModel. We will use the EditorFor html helper method in this view to call our editor template

@model ReplaceYourNamespaceHere.ShoppingCartViewModel
@using (Html.BeginForm())
{       
    @Html.EditorFor(x => x.CartItems)
    <p>Total : @Model.TotalPrice</p>
    <input type="submit" />
}

而在你的HttpPost操作方法，我们将有类型的paramer ShoppingCartViewModel 。当提交表单时，MVC模型绑定将提交的表单值映射到的对象 ShoppingCartViewModel 。

And in your HttpPost action method, We will have a paramer of type ShoppingCartViewModel. When the form is submitted, MVC Model binder will map the posted form values to an object of ShoppingCartViewModel.

[HttpPost]
public ActionResult Index(ShoppingCartViewModel model)
{
    foreach (var item in model.CartItems)
    {
        var productId = item.Id;
        // to do  : Use productId and do something
    }
    return RedirectToAction("OrderSucessful");
}

您可以通过 CartItems 访问集合，并获得产品的标识，做任何你想要的。

You can iterate through the CartItems collection and get the Id of the Products and do whatever you want.

如果您wan't允许用户编辑的项目（使用复选框）在此页面，看看<一个href=\"http://stackoverflow.com/questions/33659157/which-checkbox-is-checkedcontroller-and-results-to-list/33660035#33660035\">this回答。它基本上是一样的，但是你一个布尔属性添加到产品类，并利用它来进行渲染的复选框。

If you wan't to allow the user to edit the items (using a check box) in this page, Take a look at this answer. It is basically same, but you add a boolean property to Product class and use that for rendering a checkbox.

这篇关于使用按钮从视图中调用httppost的ActionResult的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！