Razor Pages 页面处理程序未使用 POST 方法传递 ID

Question

我有一个基本的电子商务网站，我正在尝试使用 AddToCart 功能。我的视图上有一个图标，一旦单击，应该会点击我的 AddToCart 页面处理程序方法，并传入产品 ID。该方法被我的代码命中，但没有传递 id。

它在我的其他页面处理程序（例如 OnPostEditProduct）中运行良好：

    public ActionResult OnPostAddToCart(int Id)
    {
        if (Id < 1)
        {
            return NotFound();
        }

        return new RedirectToPageResult("./Index");

    }

    public IActionResult OnPostEditProduct(int id)
    {
        if (id  < 1)
        {
            return NotFound();
        }

        return new RedirectToPageResult("./EditProduct", new { id = id });
        
    }

这是索引视图：

<div id="productsWrapper" class="row">
    @foreach (var product in Model.Products)
    {
    <div class="col-sm-3">
        <a asp-page="/order" asp-route-id="@product.Id" title="Order @product.Name">
            <div class="productInfo" id="@product.Id">
                <h3>@product.Name</h3>
                <img class="product-image img-fluid img-thumbnail" src="~/Images/Products/Thumbnails/@product.ImageName" alt="Image of @product.Name" />
                @if (SignInManager.IsSignedIn(User))
                {
                    <input type="radio" name="productcheckbox" />
                }
                <p class="description">@product.Description</p>
            </div>
        </a>
        <form asp-page-handler="AddToCart" asp-route-id="@product.Id" method="post">            
            <button><i class="fa fa-shopping-cart"></i></button>
            
        </form>
        <div class="action">
            <p class="price float-left">$@string.Format("{0:f}", product.Price)</p>
            <a class="btn btn-sm btn-danger order-button float-right" asp-page="/order" asp-route-id="@product.Id" title="Order @product.Name">Order Now</a>
        </div>
    </div>
    }
</div>


<div class="row">
    @if (SignInManager.IsSignedIn(User))
    {

        if (User.IsInRole("Admin"))
        {

            <a class="btn btn-danger order-button addproductbtn" asp-page="/addproduct">Add Product</a>


        }


        <form asp-page-handler="EditProduct" method="post">
            <button class="btn btn-danger order-button editproductbtn">Edit Product</button>
            <input type="hidden" name="id" value="" />
        </form>       

    }
</div>

知道我做错了什么吗？我是 Razor Pages 的新手。我尝试在添加到购物车行下添加一个隐藏的输入字段 - <input type="hidden" name="id" value="" /> 这也不起作用

非常感谢

Answer 1

我认为您的问题出在asp-route-id。由于您在方法中使用大写 I 声明了 int Id，因此您应该使用 asp-route-Id="@product.Id"。当您使用 asp-route 时，您将值路由到 asp-route 之后描述的方法参数。这是因为您可能会将多个内容路由到 post 方法。

为了给您一个视觉效果，我在下面修改了您的代码。看到我在 post 方法的参数中将 @product.somevalue 路由到了Somethingelse。

<form asp-page-handler="AddToCart" asp-route-Id="@product.Id" asp-route-Somethingelse="@product.somevalue" method="post">
    <button><i class="fa fa-shopping-cart"></i></button>
</form>

    public ActionResult OnPostAddToCart(int Id, string Somethingelse)
    {
        if (Id < 1)
        {
            return NotFound();
        }

        return new RedirectToPageResult("./Index");

    }

还有一点需要注意，虽然我不是 100% 确定它是否重要，但我通常会将这些属性（asp-page-handler、asp-route）放在按钮元素中，而不是表单元素中。这将使您不再需要多个表单元素。如果你给表单元素一个id=属性，你可以在按钮中使用form=属性来指定使用哪个表单。这样，按钮就可以在表单元素之外并仍然使用它。