我有一个注册表单,我在其中使用 AJAX 验证“首选登录 ID”,因此它搜索用户表并显示它是否可用,并显示在文本框“用户名可用”或“用户名不可用”旁边。
我的要求是当它不可用时,我想将文本“用户名不可用”从 Servlet 传递回 JSP 中的 javascript,以便我可以阻止用户继续表单。我相信我可以使用 AJAX 做到这一点。但我不知道该怎么做。有人可以用代码帮助我吗?
我有一个注册表单,我在其中使用 AJAX 验证“首选登录 ID”,因此它搜索用户表并显示它是否可用,并显示在文本框“用户名可用”或“用户名不可用”旁边。
我的要求是当它不可用时,我想将文本“用户名不可用”从 Servlet 传递回 JSP 中的 javascript,以便我可以阻止用户继续表单。我相信我可以使用 AJAX 做到这一点。但我不知道该怎么做。有人可以用代码帮助我吗?
我将使用 JQuery,特别是get()方法作为示例
这是一个伪解决方案(没有测试,但这是我会使用的基本方法)
JavaScript
var userIsAvailable = false;
function checkUsernameAvailability(userIdToCheck){
$.get("pathToServlet",{userId: userIdToCheck},function(resultMessage){
userIsAvailable = resultMessage=="username available" //this is bad practice, just an example, pass true/false
$("#userAvailabilityMessage").text(resultMessage);
}
});
HTML
<form onsubmit="if(!userIsAvailable){alert('user is not available')}; return userIsAvailable">
<label for="userId">preferred login id<label>
<input id="userId" ... type="text" onblur="checkUsernameAvailability(this.value)">
<div id="userAvailabilityMessage" />
...
</form>
小服务程序(部分)
@WebServlet("/pathToServlet")
public class MyServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String result;
if(isUserNameAvailable(request.getParameter("userId"))){
result = "username available";
}else{
result = "username not available";
}
response.setContentType("text/plain");
response.getWriter().print(result);
}
}
您需要在消息中发送带有一些标志的对象。您可以为此使用 json。在 servlet 方面:
// This object we will transfere from java to javascript
public class Message {
private boolean error;
private String errorMessage;
// Getters and setters ommited
}
// Servlet code - return content
Message message = new Message();
message.setError(true);
message.setErrorMessage("Your error message");
Gson gson = new Gson(); // GSON - java json library from Google. I prefer it
String content = gson.toJson(message);
response.setContentType("text/json");
response.getWriter().print(content);
最后是javascript代码:
function processRequest() {
var result = jQuery.ajax ({
url: "your.url",
method: "post",
async: false,
data: "your=data&andsomedate=somedata"
});
// Creating object from json
var message = jQuery.parseJSON(result.responseText);
// Now we can access all object fields:
if(message.error) {
alert("Error message: " + message.errorMessage);
}
}