Get JSON Datas using AJAX - Java Servlet
Hi,i am gonna show how servlet implements with JQuery AJax and JSON data for the get method with example.
1.Create a Web Application(New Project->Web Application) in NetBeans, and don't forget to also create the web.xml.
2.Create a Servlet called LoginData
Example
1.Create a Web Application(New Project->Web Application) in NetBeans, and don't forget to also create the web.xml.
import com.google.gson.Gson;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.LinkedHashMap;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class LoginData extends HttpServlet {
protected void processRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String user=request.getParameter("username");
String pass=request.getParameter("password");
Map Admin = new LinkedHashMap();
Admin.put("1", "Admin1");
Admin.put("2", "Admin2");
Admin.put("3", "Admin3");
String json_data=null;
if(user.equals("sathish")&&pass.equals("sathish"))
{
json_data = new Gson().toJson(Admin);
}
response.setContentType("application/json");
response.getWriter().write(json_data);
}
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
processRequest(request, response);
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
processRequest(request, response);
}
@Override
public String getServletInfo() {
return "Short description";
}//
3.This is the web.xml that created by the NetBeans when you create the project and the java servlet is already created the appropriate request URL for you.
<servlet>
<servlet-name>LoginData</servlet-name>
<servlet-class>LoginData</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>LoginData</servlet-name>
<url-pattern>/LoginData</url-pattern>
</servlet-mapping>
4.This is a simple HTML page to get the information based on the login.
<html>
<head>
<title>Login</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("#submit").click(function(){
var datas='username=' + $('#username').val()
+ '&password=' + $('#password').val();
alert(datas);
$.ajax({
url:"LoginData",
type:"get",
data:datas,
dataType:"JSON",
success: function(data) {
var rfew = $('#d1');
//rfew.find('li').remove();
$.each(data, function(key, value) {
rfew.append(key+'-'+ value+'<br>');
});
}
});
return false;
});
});
</script>
</head>
<body>
<div id="d1"></div>
<form id="myform" method="get">
Login Name <input type="text" name="username" id="username" /><br>
Password <input type="password" name="password" id="password" /><br>
<input type="submit" id="submit" value="Login" />
</form>
</body>
</html>
Download Complete Source:
0 comments: