将文本提交到同一个 HTML 页面答案

【问题标题】：Submit text to same HTML page将文本提交到同一个 HTML 页面
【发布时间】：2018-03-31 11:21:36
【问题描述】：

我在管理页面的视图中创建了一个文本字段和一个提交按钮，我想这样做，我提交的文本显示在同一页面上我的文本框下方。

这是我进入 adminPage 的控制器：

@RequestMapping(value = "/adminPage", method = RequestMethod.POST)
public String adminPage(Model model) {

return "adminPage";
}

这是我的 adminPage：

<form th:action="@{/adminPage}" method="post">
    <textarea rows="4" cols="50">
</textarea>
    <input type="submit" class="btn btn-lg btn-primary btn-block" 
value="Submit Text"/>

</form>

总的来说，我对控制器和 MVC 还是很陌生，我发现很难在 Java 中使用我的知识，因为控制器看起来不像我以前使用过的任何 Java，所以任何帮助都将不胜感激！

【问题讨论】：

为此使用 javascript。你不需要向服务器提交任何东西，因为它都是客户端。
我们在学校没有学过任何javascript，我感到迷茫..
是的，但如果他想提交到服务器，javascript 不是答案 :) 有时就是这种情况 - 如果他决定存储该信息而不只是显示它
我自己对MVC并不熟悉，但我想你需要弄清楚如何从你的html客户端获取数据并将其放入model，你可以使用它控制器。我将通过了解 Model 对象以及 MVC 如何管理其客户端和服务器之间的链接来开始自己回答这个问题

标签： java model-view-controller submit thymeleaf

【解决方案1】：

好吧，没有Javascript。首先，textarea 需要一个名称属性name="inputText"。

当您的服务器方法收到请求时，该名称将在模型对象中使用：

@RequestMapping(value = "/adminPage", method = RequestMethod.POST)
public String adminPage(@RequestParam("inputText") String input, Model model) {
    //Do stuff
    model.addAttribute("theText", input); //add the text which can be accessed on "adminPage"
    return "adminPage";
}

然后您可以在“adminPage.jsp”中添加<div> 并在其中附加您的文本，例如：

<div>${theText}</div>

【讨论】：

啊，很棒的解决方案！我仍然需要输入标识符，我猜 String 很好。
是的，抱歉已解决。我只是徒手打字:)

【解决方案2】：

如果，我已经正确理解了您的问题，那么这里就是可以解决问题的解决方法。

当用户从浏览器访问/adinPage 时，input_data 变量将是null 并且不会执行 if 条件。 JSP 页面将返回，第二个 textarea 为空白。

您必须使用JSP，因为HTML 页面无法更改。

Controller.java

@RequestMapping(value = "/adminPage", method = RequestMethod.POST)
public String adminPage(@RequestParam(value = "input_data", required = false) String input_data,Model model) 
{
     if(input_data!=null)
         model.addAttribute("output_data",input_data);

     return "adminPage";
}

adminPage.jsp

<form th:action="@{/adminPage}" method="post">

       <textarea id="input_data" rows="4" cols="50">
       </textarea>

       <textarea rows="4" cols="50">
       ${output_data}
       </textarea>

       <input type="submit" class="btn btn-lg btn-primary btn-block" 
       value="Submit Text"/>

</form>

当用户提交表单时，if条件将被执行，返回的视图将包含之前在第二个textarea中输入的数据

我没有测试过代码，它可能包含一些语法错误。

【讨论】：