HTML中的第一个提交按钮重定向到不同的URL答案

【问题标题】：First submit button in HTML is redirecting to different URLHTML中的第一个提交按钮重定向到不同的URL
【发布时间】：2018-08-22 07:14:24
【问题描述】：

我是 Thymeleaf 的新手，并试图删除第一条记录，但它正在将我重定向到 http://localhost:8080/findall?_method=delete 。虽然我可以删除所有记录，但它们会将我重定向到正确的 url http://localhost:8080/delete/{id}（第一个除外）。

每当我试图通过点击邮递员的“http://localhost:8080/delete/{id}”来删除记录时，我都能做到。因此，这与 .html 文件有关。

这是display.jsp文件的代码：

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>Registration Table
</head>
<body>
<form>
  <table border="1">
    <tr>
      <th>Id</th>
      <th>Name</th>
      <th>Password</th>
      <th>Delete</th>
    </tr>
    <tr th:each="list : ${list}">
      <td th:text="${list.id}">ID</td>
      <td th:text="${list.userName}">Name</td>
      <td th:text="${list.userPassword}">Password</td>
      <!--  <td><a th:href="@{/delete/{id}}">Edit</a></td> -->

      <td>
        <form th:action="@{'/delete/{id}'(id=${list.id})}" th:method="delete">
          <input type="submit" value="Delete"/>
        </form>
      </td>
    </tr>
  </table>
</form>
</body>
</html>

这里是controller.java

package com.spring.controller;

import static org.springframework.test.web.servlet.result.MockMvcResultMatchers.request;

import java.util.List;

import javax.servlet.http.HttpServlet;
import javax.xml.ws.Response;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.view.RedirectView;

import com.couchbase.client.deps.io.netty.handler.codec.http.HttpResponse;
import com.spring.model.Customer;
import com.spring.repository.CustomerRepo;

@RestController
public class Controller extends HttpServlet {

    @Autowired
    CustomerRepo rp;

    @RequestMapping(method = RequestMethod.GET, value = "/findall")
@ResponseBody
public ModelAndView findall() {
    List<Customer> list = (List<Customer>) rp.findAll();
    ModelAndView mv = new ModelAndView();
    mv.setViewName("display");
    mv.addObject("list", list);
    for (Customer element : list) {
        System.out.println("Element usernane: " + element.getUserName());
        System.out.println("Element password: " + element.getUserPassword());
    }
    mv.addObject("list", list);

    return mv;
}


    @RequestMapping(method = RequestMethod.GET, value = "/display")
    @ResponseBody
    public List<Customer> display() {
        return (List<Customer>) rp.findAll();
    }

    @RequestMapping("/")
    public ModelAndView home() {
        System.out.println("display home");
        ModelAndView mv = new ModelAndView("home");
        return mv;
    }


    @RequestMapping(method = RequestMethod.DELETE, value = "/delete/{id}")
    public ModelAndView deleteCourse(@PathVariable Long id) {
        System.out.println("deleting" + id);
        rp.delete(id);
        ModelAndView mv = new ModelAndView("redirect:home");
        return new ModelAndView("redirect:home");
    }

}

如果我单击删除按钮删除第一条记录“Ravi”，它将带我到 URL“http://localhost:8080/findall?_method=delete”并且不会删除记录（我希望它带我到 url“http://localhost:8080/delete/1”）。但如果我点击任何其他按钮，它工作正常并删除记录。

我还检查了浏览器上的 HTML 代码。它不会为每条记录生成相同的 HTML 代码。这应该是一个非常简单的修复，虽然我在 stackoverflow 上的 Thymeleaf 上没有找到太多内容。

【问题讨论】：

如果您怀疑该 html 文件，请在浏览器中查看它 - 检查生成的 html 文件以及那里生成的实际链接。（在您的浏览器中，进入“查看源代码” - 您将看到 Thymeleaf 生成的实际 HTML 文件。）

标签： java html thymeleaf

【解决方案1】：

method 属性仅接受 GET or POST 作为其值。

您可以将th:method 的值更改为“post”，并在Controller 中更新您的映射：

 @RequestMapping(method = RequestMethod.POST, value = "/delete/{id}")

更新也请删除附在你的桌子上的<form>。

【讨论】：

试过了，但并没有解决问题。
还有另外两件事对我来说看起来很可疑，但是我不知道它们是否会严重影响您的页面以导致此类问题。第一个是包含整个表格的<form>。这个是来做什么的？表单不应该嵌套。第二个是与list 模型属性变量（在th:each 内）调用相同的迭代器，但是我找不到任何文档来说明这是否重要。

【解决方案2】：

我在 HTML 中使用了两种表单。从 HTML 代码中删除外部 <form> 标记解决了该问题。

【讨论】：