asp.net - 如何在 ASP.NET CORE Razor Pages 中创建共享表单?
问题描述
我必须在我的页眉中创建一个可重复使用的表单。它应该显示在每一页上。将发送 POST 请求的简单输入和提交按钮。
我知道的选项是部分视图或视图组件。我检查了有关视图组件的文档,但没有提到它适用于表单。只有InvokeAsync
方法可用于初始化视图。
使用局部视图,可能很难定义其页面模型,而且我不明白将其 POST 处理程序放在哪里。
我看到的另一种选择,以某种方式将表单直接放在 上_Layout.cshtml
,但是,同样,它没有其页面模型(afaik),
那么什么是创建共享表单的方法,以及应该在哪里处理 POST 请求呢?
解决方案
您应该使用视图组件,因为这允许您拥有某种独立的模型和视图交互。
public class SharedFormViewComponent : ViewComponent
{
public Task<IViewComponentResult> InvokeAsync() =>
Task.FromResult(View(new SharedFormViewModel()));
}
然后,将您的表单 HTML 代码放入Views\Shared\Components\SharedForm\Default.cshtml
. 对于表单的操作,您需要指定路线。稍后会详细介绍。然后,显示您的表单:
@await Component.InvokeAsync("SharedForm")
现在,正如您所了解的那样,视图组件无法发布到。这不是“不支持表格”的问题;它们实际上不是请求管道的一部分,因此无法响应诸如 POST 之类的请求。您将需要一个独特的操作来处理某些控制器上的 POST。在组件的表单标签上,然后:
<form asp-action="SharedFormHandlerAction" asp-controller="Foo" asp-area="" method="post">
asp-area
应该提供该属性,以防万一在不同区域的上下文中使用它。
您还需要一个“返回 URL”。这将是当前页面的 URL,以便用户成功发布表单后,他们将返回到他们提交表单的页面。您可以通过在表单中添加隐藏输入来实现:
<input type="hidden" name="returnUrl" value="@(Context.Request.Query["returnUrl"].FirstOrDefault() ?? (Context.Request.Path + Context.Request.QueryString))" />
然后,您的处理程序操作应采用类似的参数string returnUrl = null
,成功后您应该执行以下操作:
return !string.IsNullOrEmpty(returnUrl) && Url.IsLocalUrl(returnUrl)
? Redirect(returnUrl)
: RedirectToAction("SomeDefaultAction");
事情变得有点棘手的地方是处理验证错误。由于您要发布到不同的操作,因此您无法返回用户之前的视图以显示布局中的 from 内的验证错误或其他任何内容。相反,您需要一个特定于该处理程序操作的视图,它只是您的共享表单。您可以在此处将视图组件用作部分视图:
<partial name="~\Views\Shared\Components\SharedForm\Default.cshtml" />
推荐阅读
- javascript - 意外行为:功能与功能组件和动画
- spark-ar-studio - Spark AR 原生 UI 选择器
- python - numpy.maximum.reduce 不返回最大值
- google-sheets - Google 表格 - 在单元格仍处于打开状态时启动宏
- razor - 是否可以从 Razor/Blazor 组件获取原始 HTML?
- r - 如何遍历仅将数字列转换为 z 分数的行和列?在 R 中
- java - 为什么实例化的 HashMap 作为 java.util.Arrays$ArrayList 返回?
- sql - 如何进行 Sequilize 查询以获取与年份无关的日期范围内的项目?
- javascript - 如何使编辑按钮从模式中工作?
- python - 如何向 Pandas 中的现有列添加值?