Javascript 对servlet的AJAX调用不起作用
我有一个servlet,它将表单输入字段插入到我的数据库中,当我设置Javascript 对servlet的AJAX调用不起作用,javascript,java,jquery,ajax,servlets,Javascript,Java,Jquery,Ajax,Servlets,我有一个servlet,它将表单输入字段插入到我的数据库中,当我设置 <form action="CreateUserServlet"> 但是我想尝试一些表单验证的东西,ajax servlet调用返回成功,但是数据没有添加到我的数据库中 servlet: protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletExce
<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');
}
});
}
})
});
显示Sucesmsg,但未插入数据。非常感谢您的帮助,谢谢您需要提供与post请求一起提交的数据,它不会自动绑定
$.ajax({
url: 'CreateUserServlet',
method: 'POST',
data: createForm.serialize(),
success: function () {
$('#successMsg').removeClass('hideMsg').addClass('showMsg');
}
});
在这种情况下,从服务器返回警报毫无意义。您应该返回一个JSON对象,其中包含要向用户显示的值。success函数只是修改successsg元素的类,您没有添加任何数据,也没有发布任何数据。。。。它不会神奇地获得表单数据,您需要提供它。数据应该由servlet添加,而不给它任何数据,所以我不需要给它任何东西。我只需要调用它。我认为success函数意味着servlet被调用了。不,Ajax调用不会发送表单。。。。如果希望发送密码,则需要提供密码。在servlet中,它使用getParameter,它应该获取表单数据