布局中的表单:剃刀页面 [英] Form in Layout: Razor Pages
问题描述
我的Web应用程序布局中的form
中有一个select
,需要从每个页面进行访问.表单设置了一个会话变量,该变量是在每个页面上加载数据所必需的.
I have a select
in a form
in the Layout of my web app that needs to be accessible from every page. The form sets a session variable that is required to load data on every page.
<form asp-page-handler="CustomerChange" method="post" class="navbar-form navbar-left">
<select name="Customer" id="Customer" class="form-control" onchange="this.form.submit()">
<option value="">Select Customer</option>
<option value="Vand">Vandalay</option>
<option value="Kram">Kramerica</option>
</select>
</form>
我知道我可以创建一个基础PageModel
并从每个页面的基础上继承来响应OnPost
例如
I know I can make a base PageModel
and inherit from that on every page in order to respond to a OnPost
e.g.
public abstract class BaseSecurePageModel : PageModel
{
[BindProperty]
public string Customer { get; set; }
public virtual void OnPostCustomerChange()
{
HttpContext.Session.SetString("Customer", Customer);
}
}
但是这并不适合于将模型绑定到表单,并且还要求我记得从每个页面的基类中继承.有没有正确的方法来处理需要随处可见的表单?
but this doesn't lend itself to having the model binded to the form and also requires that I remember to inherit from the base class in every page. Is there a correct way to handle forms that need to be available everywhere?
推荐答案
尝试改用控制器,并让CustomerChange ActionResult指定[Route()].我在剃须刀页面中的大多数布局项(例如购物车,本地化等)都使用了Controller,并且效果很好.
Try using a Controller instead and have your CustomerChange ActionResult specify a [Route()]. I use a Controller for most of my Layout items such as shopping carts, localization etc... in razor pages and works pretty well.
//根据史蒂文·B(Steven B)的反馈更新了答案.
// Updated answer based on feedback from Steven B.
下面是我上面提到的本地化示例.表单触发BaseController.cs
Below is an example of the localization I spoke about above. The form triggers a post against the SetLanguage method in the BaseController.cs
在这种情况下,在_Layout.cshtml文件中,我有一个局部视图:
In the _Layout.cshtml file I have, in this instance, a partial view:
@Html.Partial("_SetLanguagePartial") // Used prior to .net core 2.1
<partial name="_SetLanguagePartial" /> // Used for .net core 2.1+
_SetLanguagePartial.cshtml中的html包含具有相应的asp-controller和asp-action的表单
The html inside this _SetLanguagePartial.cshtml contains a form with the corresponding asp-controller and asp-action
<form id="selectLanguage" asp-controller="Base" asp-action="SetLanguage" asp-route-returnUrl="@returnUrl" method="post" class="form-horizontal" role="form">
<ul class="list-inline">
@foreach (var culture in cultureItems)
{
var countryIcon = "usa.png";
<li>
<button type="submit" class="btn btn-sm btn-link" name="culture" title="@culture.Text" value="@culture.Value">
@switch (culture.Text)
{
case "Japanese" :
countryIcon = "japan.png";
break;
case "Spanish" :
countryIcon = "spain.png";
break;
default:
break;
}
<img src="@Configuration["BlobStorage:StorageUrl"]/images/@countryIcon" alt="@culture.Text"/>
</button>
</li>
}
</ul>
</form>
BaseController.cs
BaseController.cs
[Route("[controller]/[action]")]
public class BaseController : Controller
{
[HttpGet]
public IActionResult GetCartViewComponent()
{
return ViewComponent("Cart");
}
[HttpPost]
public IActionResult SetLanguage(string culture, string returnUrl)
{
Response.Cookies.Append(
CookieRequestCultureProvider.DefaultCookieName,
CookieRequestCultureProvider.MakeCookieValue(new RequestCulture(culture)),
new CookieOptions { Expires = DateTimeOffset.UtcNow.AddYears(1)}
);
return LocalRedirect(returnUrl);
}
}
这篇关于布局中的表单:剃刀页面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!