提交一個帖子請求，但仍然在頁面上使用彈簧mvc

我有一個簡單的重置密碼窗體屏幕。當用戶通過恢復按鈕提交頁面帖子到http://localhost:8080/api/v1/accountmanagement/user/password_reset時。在該端點中，用戶的電子郵件被驗證，然後生成哈希鏈接到由系統通過電子郵件發送給用戶的鏈接。一切工作正常，只是，我想要發生的是當用戶點擊恢復按鈕，我希望他們留在恢復密碼頁面。我打算做的只是取消隱藏一個表示「謝謝你提交恢復密碼請求等」的div。顯示div不是問題（可能是使用普通的javascript - 我沒有js框架 - 也許使用jQuery），它只是當用戶點擊恢復按鈕時，發送請求轉到其餘的api更改正在顯示的頁面。提交一個帖子請求，但仍然在頁面上使用彈簧mvc

我試圖在窗體中添加target="_blank"，但它沒有奏效。我的前端只用html和thymeleaf編寫。

可能有一個簡單的解決方案，我只是想念。

resetPassword.html

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" lang="en"> 
<head> 
<title>Reset Password</title> 
<link href="css/main.css" rel="stylesheet" /> 

</head>

<div> 
    <h2> Recover your password</h2> 
    <p> 
     To recover your password follow the instructions below to reset your password. 
    </p> 
</div> 

<form th:action="@{/api/v1/accountmanagement/user/password_reset}" method="post" id="resetPasswordForm" th:object="${account}" target="_blank"> 
    <div id="field_email"> 
     <label for="email">Enter your email address : </label> 
     <p>Enter the email address with your account.</p> 
     <div > 
      <input type="text" id="email" name="email" th:field="*{email}" /> 
     </div> 
    </div> 

    <div id ="successRecover" style="display: none;"> 
     An email has been sent to your email address. The email contains instructions to reset your password. 
    </div> 
    <div th:if="${param.error}" class="login-panel_error error"> 
     Error. 
    </div> 
    <div> 
     <button type="submit" class="btn-primary"> 
      <i class="fa fa-spin fa-spinner hidden"></i> 
      <span>Recover</span> 
     </button> 
    </div> 
</form>

PasswordManagementController.ja VA

@Controller 
    @RequestMapping("/api/v1/accountmanagement") 

    public class PasswordManagementController { 
     @Autowired 
     private PasswordResetService passwordResetService; 

     private Logger LOG = LoggerFactory.getLogger(this.getClass()); 

     @RequestMapping(value = "/user/password_reset", method = RequestMethod.POST) 
     public ResponseEntity processResetPassword(@ModelAttribute(value = "account") Account account, BindingResult result, 
       HttpServletRequest request) { 
      LOG.info("account email " + account.getEmail()); 

      // build the hash here for hashUrl 

      if (account != null) { 
       if (!StringUtil.isBlank(account.getEmail())) { 
        try { 
         passwordResetService.processResetPassword(account, hashUrl); 
        } catch (AccountConfigException ace) { 
         // deal with exception here. 
         // return 
        } catch (Exception e) { 
         // deal with exception here. 
         // return 
        } 
        return new ResponseEntity(HttpStatus.OK); 
       } else { 
        // deal with an exception here. 
        // return 
       } 
      } else { 
       // deal with an exception here. 
       // return 
      } 
     } 
    }

來源

2017-10-13 bencampbell_14

爲什麼你提交的頁面/形式，可以考慮使用AJAX打服務器，當它返回的響應則使用javascript隱藏/取消隱藏正確的div。 –

如果你返回你的確會被重定向請求成功的情況下，ResponseEntity。我不知道你如何處理錯誤，但你可能想要做的是將控制器方法的返回類型更改爲String。這樣，如果迴應成功，您可以重定向到同一頁面，同時將boolean的值傳遞給將決定呈現successRecover div的模型，而不需要任何Javascript。

新的處理程序：

@RequestMapping(value = "/user/password_reset", method = RequestMethod.POST) 
public String processResetPassword(@ModelAttribute(value = "account") Account account, Model model) { 
    // build the hash here for hashUrl 
    try { 
     passwordResetService.processResetPassword(account, hashUrl); 
    } catch (AccountConfigException ace) { 
     // deal with exception here. 
     // return 
    } catch (Exception e) { 
     // deal with exception here. 
     // return 
    } 
    model.addAttribute("isOK", true); 

    return "index"; 
}

然後在視圖：

<div id="successRecover" th:if="${isOK}"> 
    An email has been sent to your email address. The email contains instructions to reset your password. 
</div>

來源

2017-11-10 16:00:15

提交一個帖子請求，但仍然在頁面上使用彈簧mvc

回答

相關問題