如何将 Spring MVC 表单标签与 AJAX 一起使用

How to use SpringMVC Form tags along with AJAX

假设我有一个登录对象,当我为 'login' 发出获取请求时,我发送登录对象并在 JSP 页面中使用模型属性和路径将属性映射为如下:

ViewController:

    @GetMapping("/login")
    public String login(Model model){
       Login login = new Login();
       model.addAttribute("login",login);
       return "login";
    }

JSP 页数:

 ...

<form:form action="login" method="post" modelAttribute="login">
        <form:hidden path="id"/>
        <label for="username">UserName</label>
        <form:input path="username"/><br>
        <label for="password">Password</label>
        <form:password path="password"/><br>
        <form:button>Login</form:button>
</form:form>
...

现在,当我点击登录按钮时,登录对象被发送到适当的控制器,它 returns 相应地响应实体对象和一些 message.Once 处理完成,页面刷新并显示 ResponseEntity 对象中的消息,比如 "Login Successful".

但我想以警报的形式显示此消息。 为此,我必须发出 AJAX 请求,并在成功后调用带有消息的警报,但在这种方法中,我不能再使用 modelAttribute 并且 AJAX 已经发送了一个登录对象,这可能吗?

有什么方法可以使用 modelAttribute 的功能并发出 AJAX 请求吗?

在深入了解相同的细节后,我终于找到了解决方案!

我必须进行以下更改。

Login.jsp - 在标签外添加一个新的按钮标签

  ...
    <form:form id="myform" action="login" method="post" modelAttribute="login">
        <form:hidden path="id"/>
        <label for="username">UserName</label>
        <form:input path="username"/><br>
        <label for="password">Password</label>
        <form:password path="password"/><br>
    </form:form>
    <button id="login-btn">Login</button>
  ...

AJAX 脚本:

       $(document).ready(function () {
           $("#login-btn").click(function () {
               $.ajax({
                   type: "POST",
                   url: "login",
                   data : $("#myform").serialize(),
                   success: function (data) {
                       alert(data);
                   },
                   error: function(data){
                       alert(data);
                  }
               });
           }) 
        });


控制器:(检查登录是否有效)

@PostMapping("/login")
    public ResponseEntity<?> login(@ModelAttribute("login") Login login){
        boolean status = loginDao.isValidLogin(login);
        String message = (status)?"Login Succcessful":"Incorrect Login Credentials!";
        return new ResponseEntity<>(message,HttpStatus.OK);
    }