ASP.NET MVC - 使用带有默认模型绑定和控制器操作的多个提交按钮
介绍
技能水平
技术 | 技能水平 |
---|---|
网上邻居 | 初学者 |
C# | 初学者 |
MVC | 初学者 |
目的
本指南将演示并解释如何使用 ASP.NET MVC 轻松创建具有多个提交按钮的 HTML 页面,使用尽可能少的代码,并利用 MVC 默认模型绑定和控制器操作。这些技术不需要 JavaScript。
结构
对于寻求快速答案的开发人员,我们将从 Razor 视图和控制器中两种多按钮技术所需的代码示例开始。
接下来,我们将仔细研究实施细节、安全注意事项以及选择最佳技术的方法。
最后,我们将提供一些建议资源,以便进一步了解所讨论的主题。
范围
本指南将重点介绍 ASP.NET MVC 默认模型绑定和控制器操作。JavaScript 技术将在单独的指南中介绍。
先决条件
执行
有两种很好的方法可以实现多个提交按钮,重点介绍基本代码。后面将介绍更多详细信息和示例代码的更多元素。
技术 1:使用相同名称的多个按钮调用默认控制器操作
通过设置几个标准属性并向默认的HttpPost控制器操作(ActionResult)添加一个参数,很容易让 HTML 表单对不同的按钮按下做出不同的响应。
此技术调用与 HTML 页面关联的 HttpPost 事件的默认 ASP.NET MVC 控制器操作。
Razor View
Razor 视图 (.cshtml) 包含多个type="submit"的<input>标签,这些标签具有相同的名称属性和不同的值属性。
值属性的值(文本)将显示为按钮文本。它们也将传递给控制器。
<input type="submit" name="answer" value="Accept" class="btn btn-success" />
<input type="submit" name="answer" value="Decline" class="btn btn-danger" />
<input type="submit" name="answer" value="Defer" class="btn btn-warning" />
这些示例在class属性中采用 Bootstrap CSS 样式显示,以便为用户提供适当的视觉指导。Bootstrap 是可选的。
默认控制器操作
表单的控制器操作将默认绑定对象作为参数。在下面的示例中,其类型为User。
它还采用一个字符串参数,该参数的名称与关联 Razor 视图(“Index”)中<input>标记的名称属性的值相同。
控制器操作实现了一个 switch 语句,该语句测试<input>标签的value属性的值。这是区分大小写的。
HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Index([Bind(Include = "UserID
技术2:使用HTML5属性调用不同的控制器方法
与第一种方法一样,这种方法仍然使用多个type="submit"的<input>标签,具有相同的 'name' 属性和不同的 'value' 属性。
它为 HML5 中实现的<input>标签添加了附加属性; formaction和formmethod。
每个按钮都会调用一个与页面默认控制器操作不同的单独控制器操作。
Razor 视图 (.cshtml)
与第一种技术类似,此方法使用多个<input>标签,这些标签具有相同的name属性值和不同的 value 属性值(文本)。它还添加了两个在 HTML5 中实现的属性:
formaction - 指定按下按钮时要采取什么操作。
formmethod - 指定这是一个 HttpPost 还是 HttpGet 操作。
formaction属性的值是按下按钮时要调用的控制器操作的名称,示例中为“TermsAccept”或“TermsDecline”。请参阅下面的表单操作部分,了解为什么使用 Razor @Url.Action()方法来提供 URL 是个好主意。
对于 HttpPost, formmethod的值应该是“post”。
与第一种技术一样, value属性的值(文本)为按钮提供文本。
<input type="submit" name="response" value="Accept" formaction=@Url.Action("TermsAccept") formmethod="post" class="btn btn-primary" />
<input type="submit" name="response" value="Decline" formaction=@Url.Action("TermsDecline") formmethod="post" class="btn btn-default" />
与第一种技术一样,Bootstrap 样式是可选的。
控制器动作匹配 formaction 属性值
使用 HTML5 formaction属性可以为每个按钮创建单独的控制器操作。上面显示的每个提交按钮都有一个与formaction值相对应的控制器操作。
使用<input>标签在页面上创建的按钮的value属性不需要参数。
HttpPost]
[ValidateAntiForgeryToken]
public ActionResult TermsAccept([Bind(Include = "UserID
与使用页面的默认控制器操作相比,此技术提供了更多的控制、灵活性和关注点分离。 可以专门为该任务编写的一些功能包括:
- 模型绑定——返回数据中的不同字段可以进行绑定。
- 错误处理——可以专门为操作编写。
- 流控制 - 每个按钮可以有自己的控制流,通过限制每个方法的返回路径数量使代码更易于理解。
请注意,此技术需要 HTML 5 支持,因此它与某些浏览器不兼容。自 2011 年或 2012 年以来更新的任何浏览器都支持此功能。有关特定浏览器的信息,请参阅caniuse.com 。
还要注意,在上面的例子中,方法TermsDecline绑定了User对象中的相同字段,与TermsAccept绑定,但这不是必须的。第二种方法也可以是:
HttpPost]
[ValidateAntiForgeryToken]
public ActionResult TermsDecline()
{
return RedirectToAction("Index"
我们可以看到,为每个按钮实现一个控制器操作并不像人们想象的那么繁重。
深入了解
现在您已经有机会一探究竟,让我们进一步分析一下。
这是两种广泛适用的技术,使用 ASP.NET 的原生功能在网页上实现多个提交按钮。所需的代码很少,而且不必是 JavaScript。
以下是关于每种技术的各个方面的一些开发人员说明。
实现细节
技术 1:默认控制器操作
此方法要求您保持每个<input>标记的值属性与控制器中switch语句的大小写同步。当这些值为字符串时,它们区分大小写。
它还要求您向控制器方法添加一个参数,该参数具有与您为<input>按钮组指定的相同且区分大小写的名称。
数字是有效参数:您可以将数值用作value参数,在这种情况下,您无需在值周围使用双引号。您的按钮文本将是您为每个按钮分配的数值,因此这是一个仅限于通过按下按钮收集数字信息的用例(除非您有理由为按钮分配序数值,这在大多数情况下不太具有交流性)。请记住,如果您要使用数字,则与 s
免责声明:本内容来源于第三方作者授权、网友推荐或互联网整理,旨在为广大用户提供学习与参考之用。所有文本和图片版权归原创网站或作者本人所有,其观点并不代表本站立场。如有任何版权侵犯或转载不当之情况,请与我们取得联系,我们将尽快进行相关处理与修改。感谢您的理解与支持!
请先 登录后发表评论 ~