C# Razor 页面部分视图模型在提交时为空
C# Razor pages Partial View Model is null on submit
我是 Razor 页面的新手,正在尝试创建具有局部视图的页面。部分视图有一个下拉列表和一个用于数量字段的文本输入以及一个提交按钮。部分视图正确呈现,但是当我单击“提交”按钮时,传递给后面代码的模型没有任何价值。
这是我的代码
_PartialAddons.cshtml
@*
For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
}
@model Public.Areas.Register.AddonListDto
<form method="post">
@Html.HiddenFor(Model => Model.Quantity)
<div style="padding:5px;">
<b>NZD </b>
</div>
<div>
<div style="padding:5px;">
<select id="skuSelect" asp-for="SelectedSkus" asp-items="@(new SelectList(Model.AddonSkus,"SkuId","SkuName"))" class="form-control">
<option>Please select one</option>
</select>
</div>
<div style="padding:5px;">
<input type="hidden" name="handler" value="Quantity" />
<input asp-for="Quantity" name="Quantity" class="form-control ng-untouched ng-pristine ng-valid" max="999" min="0" style="width:150px;" type="number" value="0" id="@Model.Id">
</div>
</div>
<div style="padding:5px;">
<a class="btn green" asp-page-handler="AddToCart">Add to Cart</a>
</div>
</form>
这是主页
@foreach (var addons in Model.StoreAddonList)
{
<div class="panel card panel-default" style="margin-top:10px;">
<div class="panel-heading card-header" role="tab">
<div class="panel-title">
<div class="accordion-toggle" role="button" aria-expanded="true">
<div accordion-heading="" style="width:100%;">
@addons.Title
<i class="pull-right float-xs-right glyphicon glyphicon-chevron-down"></i>
</div>
</div>
</div>
</div>
<div class="panel-collapse collapse in show" role="tabpanel" style="overflow: visible; height: auto; display: block;" aria-expanded="true" aria-hidden="false">
<div class="panel-body card-block card-body">
<div style="padding-top:10px;background-color:#ffffff;clear:both;">
<div style="width:100%">
<div style="float:left;width:20%;text-align:left;">
Name
</div>
<div style="float:left;width:30%;padding-left:10px;">
@addons.Description
</div>
</div>
<div style="float:left;width:40%;padding-left:10px;">
<div>
@{
await Html.RenderPartialAsync("_PartialAddons.cshtml", addons);
}
</div>
</div>
<div style="clear:both;">
</div>
</div>
</div>
</div>
</div>
}
这是Index.cshtml.cs处理提交
public ActionResult OnGetAddToCart(AddonListDto addOnList)
{
var sass = Quantity;
var tass = SelectedSkus;
return null;
}
OnGetAddToCart 方法中的 AddonListDto 为空。在过去的两天里一直在努力让这个工作。任何帮助将不胜感激
如果要提交数据,需要在 razor 页面中使用 OnPost
而不是 OnGet
,并在 <form>
标记中设置处理程序名称。例如:
处理程序:
public ActionResult OnPostAddToCart(AddonListDto addOnList)
局部视图:
@model Public.Areas.Register.AddonListDto
<form method="post" asp-page-handler="AddToCart">
@Html.HiddenFor(Model => Model.Quantity)
<div style="padding:5px;">
<b>NZD </b>
</div>
<div>
<div style="padding:5px;">
<select id="skuSelect" asp-for="SelectedSkus" asp-items="@(new SelectList(Model.AddonSkus,"SkuId","SkuName"))" class="form-control">
<option>Please select one</option>
</select>
</div>
<div style="padding:5px;">
<input type="hidden" name="handler" value="Quantity" />
<input asp-for="Quantity" name="Quantity" class="form-control ng-untouched ng-pristine ng-valid" max="999" min="0" style="width:150px;" type="number" value="0" id="@Model.Id">
</div>
</div>
<div style="padding:5px;">
<input type="submit" value="Add To Cart" class="btn btn-primary" />
</div>
</form>
我是 Razor 页面的新手,正在尝试创建具有局部视图的页面。部分视图有一个下拉列表和一个用于数量字段的文本输入以及一个提交按钮。部分视图正确呈现,但是当我单击“提交”按钮时,传递给后面代码的模型没有任何价值。
这是我的代码
_PartialAddons.cshtml
@*
For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
}
@model Public.Areas.Register.AddonListDto
<form method="post">
@Html.HiddenFor(Model => Model.Quantity)
<div style="padding:5px;">
<b>NZD </b>
</div>
<div>
<div style="padding:5px;">
<select id="skuSelect" asp-for="SelectedSkus" asp-items="@(new SelectList(Model.AddonSkus,"SkuId","SkuName"))" class="form-control">
<option>Please select one</option>
</select>
</div>
<div style="padding:5px;">
<input type="hidden" name="handler" value="Quantity" />
<input asp-for="Quantity" name="Quantity" class="form-control ng-untouched ng-pristine ng-valid" max="999" min="0" style="width:150px;" type="number" value="0" id="@Model.Id">
</div>
</div>
<div style="padding:5px;">
<a class="btn green" asp-page-handler="AddToCart">Add to Cart</a>
</div>
</form>
这是主页
@foreach (var addons in Model.StoreAddonList)
{
<div class="panel card panel-default" style="margin-top:10px;">
<div class="panel-heading card-header" role="tab">
<div class="panel-title">
<div class="accordion-toggle" role="button" aria-expanded="true">
<div accordion-heading="" style="width:100%;">
@addons.Title
<i class="pull-right float-xs-right glyphicon glyphicon-chevron-down"></i>
</div>
</div>
</div>
</div>
<div class="panel-collapse collapse in show" role="tabpanel" style="overflow: visible; height: auto; display: block;" aria-expanded="true" aria-hidden="false">
<div class="panel-body card-block card-body">
<div style="padding-top:10px;background-color:#ffffff;clear:both;">
<div style="width:100%">
<div style="float:left;width:20%;text-align:left;">
Name
</div>
<div style="float:left;width:30%;padding-left:10px;">
@addons.Description
</div>
</div>
<div style="float:left;width:40%;padding-left:10px;">
<div>
@{
await Html.RenderPartialAsync("_PartialAddons.cshtml", addons);
}
</div>
</div>
<div style="clear:both;">
</div>
</div>
</div>
</div>
</div>
}
这是Index.cshtml.cs处理提交
public ActionResult OnGetAddToCart(AddonListDto addOnList)
{
var sass = Quantity;
var tass = SelectedSkus;
return null;
}
OnGetAddToCart 方法中的 AddonListDto 为空。在过去的两天里一直在努力让这个工作。任何帮助将不胜感激
如果要提交数据,需要在 razor 页面中使用 OnPost
而不是 OnGet
,并在 <form>
标记中设置处理程序名称。例如:
处理程序:
public ActionResult OnPostAddToCart(AddonListDto addOnList)
局部视图:
@model Public.Areas.Register.AddonListDto
<form method="post" asp-page-handler="AddToCart">
@Html.HiddenFor(Model => Model.Quantity)
<div style="padding:5px;">
<b>NZD </b>
</div>
<div>
<div style="padding:5px;">
<select id="skuSelect" asp-for="SelectedSkus" asp-items="@(new SelectList(Model.AddonSkus,"SkuId","SkuName"))" class="form-control">
<option>Please select one</option>
</select>
</div>
<div style="padding:5px;">
<input type="hidden" name="handler" value="Quantity" />
<input asp-for="Quantity" name="Quantity" class="form-control ng-untouched ng-pristine ng-valid" max="999" min="0" style="width:150px;" type="number" value="0" id="@Model.Id">
</div>
</div>
<div style="padding:5px;">
<input type="submit" value="Add To Cart" class="btn btn-primary" />
</div>
</form>