Thymeleaf 以一种形式提交多个提交按钮

Posted 2023-02-26

【中文标题】Thymeleaf 以一种形式提交多个提交按钮

【英文标题】：Thymeleaf multiple submit button in one form

【发布时间】：2015-10-02 19:08:40

【问题描述】：

我有一个带有一个表单和两个按钮的 html 页面片段：

<form action="#" data-th-action="@/action/edit" data-th-object="$model" method="post">
    <button type="submit" name="action" value="save">save</button>
    <button type="submit" name="action" value="cancel">cancel</button>
</form>

还有控制器：

@RequestMapping(value="/edit", method=RequestMethod.POST)
public ModelAndView edit(@ModelAttribute SomeModel model, 
        @RequestParam(value="action", required=true) String action) 

    if (action.equals("save")) 
        // do something here     
    

    if (action.equals("cancel")) 
       // do another thing
    
    return modelAndView;

这项工作很好，但如果我有更多按钮，我必须添加更多if 语句来检查action 字符串。还有其他方法可以为表单中的每个按钮创建一个操作吗？

【问题讨论】：

表单操作 url 是 "@/action/edit" 但在你的控制器 "/edit" 中，你能告诉我你是如何链接你的 html 和控制器的吗？

Pranesh Sahu，可能是控制器类上的前缀@RequestMapping(value="action")？

【参考方案1】：

您可以使用 params 变量创建具有不同 @RequestMappings 的单独方法。

@RequestMapping(value="/edit", method=RequestMethod.POST, params="action=save")
public ModelAndView save() 


@RequestMapping(value="/edit", method=RequestMethod.POST, params="action=cancel")
public ModelAndView cancel() 

【参考方案2】：

如果您不想将每个选项都作为新的请求映射，您可以使用 switch case 来代替 if-case。

@RequestMapping(value="/edit", method=RequestMethod.POST)
public ModelAndView edit(@ModelAttribute SomeModel model, 
        @RequestParam(value="action", required=true) String action) 
    switch(action) 
        case "save":
            // do stuff
            break;
        case "cancel":
            // do stuff
            break;
        case "newthing":
            // do stuff
            break;
        default:
            // do stuff
            break;
    

【讨论】：

很晚才注意到，但default 中的break; 非常多余（因为switch 语句无论如何都会退出）。

【参考方案3】：

这适用于我的问题。 在提交按钮上使用 th:formaction 这是你有多少提交按钮的工作 这对于为具有不同提交按钮的表单提供更多链接也很有用

<form action="#"  class="form" th:action="@'/publish-post/'+$post.id" method="post">
<input class="savebtn" type="submit" value="Save" th:formaction="'/save-post/'+$post.id">
<input class="publish" type="submit" value="Publish Article">
</form>

【参考方案4】：

对于多个提交按钮，以下对我有用。 注意：th:formaction 在取消按钮中。

<form action="#" th:action="@/saveProducts" th:object="$model" method="post">
  <button type="submit" name="action" value="cancel" th:formaction="@/cancelProducts">CANCEL</button>
  <button type="submit" name="action" value="save">SAVE</button>
</form>

对于控制器：

   @RequestMapping(value="/saveProducts", method= RequestMethod.POST)
    public String save(@ModelAttribute SomeModel model) 
      *//Do something*
    

    @RequestMapping(value="/cancelProducts", method=RequestMethod.POST)
    public String cancel(@ModelAttribute SomeModel model) 
      *//Do something*

    

【参考方案5】：

您可以知道单击了哪个提交按钮，然后对按钮进行操作 这是代码

String btnName = request.getParameter("action");

if(btnName.equals("save"))
    // you code....
else if(btnName.equals("cancel"))
    // you code....

【讨论】：

澄清反对意见：这不仅与问题的重点完全不同（在这种情况下寻找避免if 构造的方法），而且使用request.getParameter(...) 是一种方式比使用 @RequestParam 将其直接连接到方法参数更糟糕（如问题代码中所做的那样）。