AJAX調用servlet中不工作

我有一個servlet將插入表單輸入字段到我的數據庫和它的作品當我設置AJAX調用servlet中不工作

<form action="CreateUserServlet">

但我想嘗試一些表單驗證的東西和AJAX的servlet調用返回成功但數據不會添加到我的數據庫中。

的servlet：

protected void processRequest(HttpServletRequest request, HttpServletResponse response) 
     throws ServletException, IOException { 
    response.setContentType("text/html;charset=UTF-8"); 
    String username = request.getParameter("usernameField"); 
    String password = request.getParameter("passwordField"); 

    if (MySqlCon.createUser(username, password)) { 
     try (PrintWriter out = response.getWriter()) { 
      out.println("<script type=\"text/javascript\">"); 
      out.println("alert('Account Successfully Created!');"); 
      out.println("</script>"); 
     } 
    } else { 
     try (PrintWriter out = response.getWriter()) { 
      out.println("<script type=\"text/javascript\">"); 
      out.println("alert('Error in Creating Account!');"); 
      out.println("</script>"); 
     } 
    } 
}

HTML表單

<div class="collapse" id="createAcc"> 
       <div class="create-wrapper"> 
        <form method="post" id="create-ajax"> 
         <h3> Enter your details </h3> 
         <div class="row"> 
          <div class="col-md-12"> 
           <input type="text" name="usernameField" placeholder="choose username" id="createUsername"/> 
           <p class="hideMsg" id="createUserError">bad username, try again</p> 
          </div> 
         </div> 
         <div class="row"> 
          <div class="col-md-12"> 
           <input type="text" name="passwordField" placeholder="choose password" id="createPassword"/> 
           <p class="hideMsg" id="createPasswordError">bad password, try again</p> 
          </div> 
         </div> 
         <div class="row buttonRow"> 
          <div class="col-md-12"> 
           <input id="submitCreateAcc" type="submit" value="Create"/> 
           <p class="hideMsg" id="successMsg">Account created!</p> 
          </div> 
         </div> 
        </form> 
       </div> 
      </div>

的JavaScript：

$(document).ready(function() { 
var createForm = $('#create-ajax'); 

$(createForm).submit(function (event) { 
    event.preventDefault(); 

    var username = $('#createUsername').val(); 
    var password = $('#createPassword').val(); 

    if (username.length < 6) { 
     $('#createUserError').removeClass('hideMsg').addClass('showMsg'); 
    } else { 
     $('#createUserError').removeClass('showMsg').addClass('hideMsg'); 
    } 
    if (password.length < 8) { 
     $('#createPasswordError').removeClass('hideMsg').addClass('showMsg'); 
    } else { 
     $('#createPasswordError').removeClass('showMsg').addClass('hideMsg'); 
    } 

    if (username.length >= 6 && password.length >= 8) { 
     $.ajax({ 
      url: 'CreateUserServlet', 
      method: 'POST', 
      success: function() { 
       $('#successMsg').removeClass('hideMsg').addClass('showMsg'); 
      } 
     }); 
    } 
}) 
});

的sucessMsg顯示，但該數據沒有得到插入。任何幫助表示讚賞，謝謝

來源

2017-07-07 ricefieldboy

成功函數只是修改了successMsg元素的類，你沒有添加任何數據 –

不要發佈任何數據....它不會奇蹟般地獲取表單數據，你需要提供它。 – epascarello

數據應該由servlet添加而不提供任何數據，所以我不需要給它任何東西。我只需要調用它。我認爲成功函數意味着調用了servlet – ricefieldboy

你需要提供的數據提交與發佈請求，它不會自動綁定。

$.ajax({ 
    url: 'CreateUserServlet', 
    method: 'POST', 
    data: createForm.serialize(), 
    success: function() { 
    $('#successMsg').removeClass('hideMsg').addClass('showMsg'); 
    } 
});

並且在這種情況下從服務器返回警報沒有任何意義。你應該返回一個帶有你想要顯示給用戶的值的JSON對象。

來源

2017-07-07 15:34:10 epascarello

非常感謝老闆，現在工作。 – ricefieldboy

AJAX調用servlet中不工作

回答

相關問題