asp.net-mvc - 如何处理同一表单中的多个提交按钮

Question

我是 mvc 新手。我知道这样我可以以相同的形式处理多个提交按钮。

<%
 using (Html.BeginForm("LoginRegistration", new { action = "LoginRegistration", controller = "Register"}, FormMethod.Post, new { @class = "form", id = "formId" }))
    {
     %>
        //your html code here
        <input type="submit" name="submitButton" value="Login"/>
        <input type="submit" name="submitButton" value="Register"/>
<% }%>

[HttpPost]
        public ActionResult LoginRegistration(string submitButton)
        {
            switch (submitButton)
            {
                case "Login":
                    return RedirectToAction("Login");
                case "Register":
                    return RedirectToAction("Register");
                default:
                    return null;
            }
        }

在我的情况下，我必须为所有提交按钮提供按钮名称 submitButton 但我想为所有提交按钮提供不同的名称。是否可以？

我想知道有没有其他方法可以处理这种情况。所以请用示例代码讨论所有其他方式来处理这种情况。谢谢

更新

我看到另一个人以下面的方式处理同样的问题。给出了代码，但我不明白他的伎俩。他为一个提交按钮添加了一个隐藏字段......为什么？
他将按钮值属性设置为 true 并将相应隐藏字段的值属性设置为 false ......为什么我无法理解这个技巧。

另一个问题是何时调用 action 方法，然后将如何传递 bool 值以及将传递哪个控件的 bool 值....请仔细阅读此更新后的代码并详细指导我此代码的工作方式。谢谢

<%
 using (Html.BeginForm("LoginRegistration", new { action = "LoginRegistration", controller = "Register"}, FormMethod.Post, new { @class = "form", id = "formId" }))
    {
     %>
        //your html code here
        <button type="submit" name="login" value="true">Login</button>
        <input type="hidden" name="login" value="false"/>
        <button type="submit" name="register" value="true">Register</button>
        <input type="hidden" name="register" value="false"/>
<% }%>

[HttpPost]
        public ActionResult LoginRegistration(bool login, bool register)
        {
           if (login) return RedirectToAction("Login");
           else if (register) return RedirectToAction("Register");
        }

更新

我的看法如何

<div id="mydiv">
    @using (Html.BeginForm("MultipleSubmitBtn", "MultipleSubmitBtn", FormMethod.Post, new { @Id = "Form1" }))
        {
            <table border="0">

                <tr>
                    <td colspan="2">
                    <button type="submit" id="b1" value="true"> 1 </button>
                    <button type="submit" id="b2" value="true"> 2 </button>
                    <button type="submit" id="b3" value="true"> 3 </button>
                    <button type="submit" id="b4" value="true"> 4 </button>
                    <button type="submit" id="b5" value="true"> 5 </button>

                    <input type="hidden" id="b1" value="false" />
                    <input type="hidden" id="b2" value="false" />
                    <input type="hidden" id="b3" value="false" />
                    <input type="hidden" id="b4" value="false" />
                    <input type="hidden" id="b5" value="false" />
                    </td>
                </tr>
            </table>
        }
</div>

Controller 代码

public class MultipleSubmitBtnController : Controller
    {
        [HttpPost]
        public ActionResult MultipleSubmitBtn(string b1, string b2, string b3, string b4, string b5)
        {
            return View();
        }

    }

当我使用这样的语法时，我得到了错误

 public ActionResult MultipleSubmitBtn(string? b1, string? b2, string b3?, string b4?, string b5?) 

请检查您的代码并告诉我为什么它不起作用。谢谢

Answer 1

在 HTML5 中有一个名为 formaction 的新属性。您可以在哪里更改 action form 的属性取决于正在单击的按钮。

<input type='submit' formaction='/home/login' value='Login'>
<input type='submit' formaction='/home/register' value='Register'>

但是，此标记在 IE9 及更早版本中无效。

编辑:扩展答案

您给出的第二个示例背后的想法是，按钮仅在被单击时才发送其值。要使操作方法起作用，您需要同时拥有 login和一个 register传递的值(value)。但由于只能按下其中一个按钮，因此只会传递其中一个值。这就是为什么他添加了两个默认值 false 的隐藏字段的原因。 ，从而确保两个参数始终传递给操作方法。单击的按钮将覆盖隐藏字段。

第一个变量对的名称设置为 login .请注意，它被定义了两次，首先是一个按钮，然后是一个隐藏字段。如果单击此按钮，则 true将被发送。如果单击另一个按钮，则不会发送此按钮的值，而是发送隐藏字段(具有相同名称)。

<button type="submit" name="login" value="true">Login</button>
<input type="hidden" name="login" value="false"/>

第二个变量对(名称为 Register )以相同的方式工作。如果未单击此按钮，隐藏字段将成为“后备选项”。

<button type="submit" name="register" value="true">Register</button>
<input type="hidden" name="register" value="false"/>

只能单击其中一个按钮。如果单击注册按钮，则将使用登录的回退值。如果单击登录按钮，则将使用注册的回退值。

总共只有两个变量将被发送到 ActionScript : login和 register .

如果你想在客户端解决它，你可以简单地让提交按钮使用 onclick 改变 Action 。事件。

<form name="myFormName" action="Login">
  <input type="submit" value="Login" />
  <input type="submit" onclick="document.myFormName.action='Register'" value="Register" />

您需要使用 name form 中的属性为了这个工作。


编辑 2:单击按钮时的更多信息

如果你有5个按钮...

<button type="submit" id="b1" value="true"> 1 </button>
<button type="submit" id="b2" value="true"> 2 </button>
<button type="submit" id="b3" value="true"> 3 </button>
<button type="submit" id="b4" value="true"> 4 </button>
<button type="submit" id="b5" value="true"> 5 </button>

...然后你点击 b3 然后只有 b3 将它的值发送回服务器。这只是为了让您可以轻松地在服务器上看到单击了哪个按钮。

如果您的服务器上有一个需要所有 5 个按钮变量的操作方法，那么您必须确保以不同的方式发送它们。这样做的原因是 MVC 尝试将传入变量与操作方法匹配，并且此操作方法需要所有 5 个按钮变量都有效。

[HttpPost]
public ActionResult LoginRegistration(string b1, string b2, string b3, string b4, string b5)
{
  ...
}

由于b1、b2、b4、b5在我们点击b3的时候不会被发送到服务器，而且由于action方法需要它们，所以我们必须想出另一种发送它们的方式。

一种方法是使用与按钮同名的隐藏字段。隐藏字段总是被发送到服务器。因此，通过在按钮之后添加这些字段，我们可以确保所有 b1、b2、b3、b4 和 b5 都将某些内容发送到服务器。如果我们单击 b3，则将使用按钮的值而不是隐藏字段。

<input type="hidden" id="b1" value="false" />
<input type="hidden" id="b2" value="false" />
<input type="hidden" id="b3" value="false" />
<input type="hidden" id="b4" value="false" />
<input type="hidden" id="b5" value="false" />

通过这样做，上面的操作方法将起作用，因为无论用户单击哪个按钮，所有五个 b 值都将发送到服务器。

编辑 3:没有隐藏字段
可以有不同的按钮而没有发送值的后备隐藏字段。我们仍然考虑与以前相同的按钮，但名称不同。但这一次我们没有隐藏的值。因此，如果单击按钮 3，则仅将 b3=true 发送到服务器。

<button type="submit" id="b1" value="true"> 1 </button>
<button type="submit" id="b2" value="true"> 2 </button>
<button type="submit" id="b3" value="true"> 3 </button>
<button type="submit" id="b4" value="true"> 4 </button>
<button type="submit" id="b5" value="true"> 5 </button>

对于要在此场景中使用的操作方法，我们需要将所有字段设为可选，以便 MVC 可以将所有/部分/无字段与传入变量进行匹配。它是通过写 string? 来完成的而不是 string在参数字段中。 ?表示可选(它实际上意味着该值可以为空/空)。

[HttpPost]
public ActionResult LoginRegistration(string? b1, string? b2, string? b3, string? b4, string? b5)
{
  ...
}

所以在这种情况下，即使只有 b3=true 这个 Action 方法也会起作用正在发送而所有其他人都没有发送。