Razor 页面处理程序未使用 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>

知道我做错了什么吗？我是剃刀页面的新手。我尝试在我的添加到购物车行下添加一个隐藏的输入字段 -<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=属性来指定要使用的表单。这样，按钮可以位于表单元素之外，但仍可以使用它。