Jsp post 和 jquery 到 servlet

Question

我正在使用 jsp 将表单发送到 servlet。在服务器端处理完成，然后我想向用户发出警报，通知他是否成功。问题是我没有收到警报，但也不例外。当 post 结束时，我看到（虽然我不想）浏览器上的表单值 url 就像一个 get... 这是代码

<form id="register" class="form-signin" >
<h2 class="form-signin-heading">Register here</h2>
First Name:<input type="text" name="firstName" class="input-block-level" placeholder="user name" required><br>
Last Name:<input type="text" name="lastName" class="input-block-level" placeholder="user name" required><br>
User Name:<input type="text" name="user" class="input-block-level" placeholder="user name" required><br>
Password:<input type="password" name="password" class="input-block-level" placeholder="Password" required><br>
Retype Password:<input type="password" name="retypedPassword" class="input-block-level" placeholder="Password" required><br>
Email:<input type="email" name="email" class="input-block-level" placeholder="email required"><br>
Retype Email:<input type="email" name="retypedEmail" class="input-block-level" placeholder="email required"><br>
<input type="submit" value="submit" id="submitButton" class="btn btn-primary">

</form>
<script type="text/javascript">
 $(document).ready(function(){
    $("#submitButton").on("click", function(){

     $.ajax({
            type: "POST",
            url: "RegisterServlet", //process to mail
            data: $("#register").serialize(),
            success: function(msg){

                alert(msg);
            },
            error: function(){
                alert("failure editing account. User name already taken");
            }
        });

});

});

</script>

在服务器端

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    String firstName = request.getParameter("firstName");
    String lastName = request.getParameter("lastName");
    String username = request.getParameter("user");
    String password = request.getParameter("password");
    String retypedPassword = request.getParameter("retypedPassword");
    String email =request.getParameter("email");
    String retypedEmail = request.getParameter("retypedEmail");
    String hash = UUID.randomUUID().toString();
    if(firstName == null || firstName.equals("")){
        errorMsg = "First name can't be null or empty.";
    }
    if(lastName == null || lastName.equals("")){
        errorMsg = "Last name can't be null or empty.";
    }
    if(username == null || username.equals("")){
        errorMsg = "User name can't be null or empty.";
    }
    if(password == null || password.equals("")){
        errorMsg = "Password can't be null or empty.";
    }
    if(retypedPassword == null || retypedPassword.equals("")){
        errorMsg = "Retype password can't be null or empty.";
    }
    if(email == null || email.equals("")){
        errorMsg = "Email can't be null or empty.";
    }
    if(retypedEmail == null || retypedEmail.equals("")){
        errorMsg = "Retyped email can't be null or empty.";
    }
    if(password.equals(retypedPassword)==false){
        errorMsg = "Passwords do not match.";
    }
    if(retypedEmail.equals(email)==false){
        errorMsg = " Emails are not the same.";
    }
    if(errorMsg != null){
        response.setContentType("text/plain");  // Set content type of the response so that jQuery knows what it can expect.
        response.setCharacterEncoding("UTF-8"); 
        response.getWriter().write(errorMsg);  

    }

但即使我尝试，我也一无所获。这段代码有什么问题？为什么提交后我在 url 上看到参数？？

Answer 1

Why After submiting I see the params on the url??

您可以在 URL 中看到这些参数，因为您的表单没有使用 ajax (jquery) 提交，您必须在表单上使用 submit 处理程序，而不是单击按钮上的处理程序。

当您在 submit 按钮上绑定点击事件时，在到达 jquery 之前提交您的表单。

使用这个：e.preventDefault(); 来防止默认提交表单。

而不是使用 submit 按钮点击处理程序：

$("#submitButton").on("click", function(){
  //your code
}

使用form 提交处理程序：

$('#register').on("submit", function(e) {
  e.preventDefault();//preventing default submission 
  //your code
}

Answer 2

您的表单似乎是通过“´”控件而不是 javascript 提交的。表单的默认方法是 GET（有关详细解释，请参阅 here），这就是您在地址栏中看到参数的原因。

将输入类型从 submit 更改为 button，或将 <input> 替换为 <button>，您将可以更严格地控制正在发生的事情。

Answer 3

这里的问题是您的注册表已提交，但您的 ajax 调用失败。

I see (though I don't want to) the values of the form on the browser url like a get

由于表单已提交且未指定方法，因此默认为 get，这导致通过 url.

发送参数

试试这个：

$(document).ready(function(){
  $("#register").on("submit", function(){
    /* to do here */
    return false;// restricts form submit
  }
};

Jsp post 和 jquery 到 servlet

Jsp post with jquery to servlet

java

jquery

jsp

servlets