This is a little bit more difficult than simple.
This example shows
1- how to define a servlet with web.xml and JAVA source lib
2- how to call this servlet via AJAX
3- how to pass values to the servlet via AJAX
4- how to receive returned values from the called servlet via AJAX
5- how to do all of these many times at the same JSP
web.xml
-------
<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_9" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<display-name>Simple CRUD of ARS</display-name>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>new</servlet-name>
<servlet-class>servletPackage.createServlet</servlet-class>
</servlet>
<servlet>
<servlet-name>readnext</servlet-name>
<servlet-class>servletPackage.readNextServlet</servlet-class>
</servlet>
<servlet>
<servlet-name>readprev</servlet-name>
<servlet-class>servletPackage.readPrevServlet</servlet-class>
</servlet>
<servlet>
<servlet-name>save</servlet-name>
<servlet-class>servletPackage.updateServlet</servlet-class>
</servlet>
<servlet>
<servlet-name>delete</servlet-name>
<servlet-class>servletPackage.deleteServlet</servlet-class>
</servlet>
<servlet>
<servlet-name>list</servlet-name>
<servlet-class>servletPackage.listServlet</servlet-class>
</servlet>
<servlet>
<servlet-name>selectlist</servlet-name>
<servlet-class>servletPackage.selectListServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>new</servlet-name>
<url-pattern>/new</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>readnext</servlet-name>
<url-pattern>/readnext</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>readprev</servlet-name>
<url-pattern>/readprev</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>save</servlet-name>
<url-pattern>/save</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>delete</servlet-name>
<url-pattern>/delete</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>list</servlet-name>
<url-pattern>/list</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>selectlist</servlet-name>
<url-pattern>/selectlist</url-pattern>
</servlet-mapping>
</web-app>
createServlet.java
------------------
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
package servletPackage;
import java.io.*;
import java.util.Enumeration;
import javax.servlet.ServletException;
import javax.servlet.http.*;
import util.Escape;
public class createServlet extends HttpServlet {
public void init()
throws ServletException {
System.out.println("ARSmsg: createServlet began to work");
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//response.setContentType("text/json;charset=UTF-8");
response.setContentType("text/html;charset=UTF-8");
//response.setContentType("application/json;charset=UTF-8");
PrintWriter out = response.getWriter();
try {
Enumeration e =request.getParameterNames();
while (e.hasMoreElements()) {
String key = (String) e.nextElement();
System.out.println(key);
}
StringBuffer s =request.getRequestURL();
System.out.println(s.toString());
String name = request.getParameter("name");
String last = request.getParameter("last");
String hobby = request.getParameter("hobby");
System.out.println("ProcessData began");
name = name+ " new,";
name = Escape.html(name);
last = Escape.html(last);
hobby = Escape.html(hobby);
// for JSON output
name = Escape.javaScript(name);
last = Escape.javaScript(last);
hobby = Escape.javaScript(hobby);
out.println(
"{"
+ " \"name\":" + '"' + name + '"' + ","
+ " \"last\":" + '"' + last + '"' + ","
+ " \"hobby\":" + '"' + hobby + '"'
+ "}");
System.out.println("ProcessData out id="+name);
} finally {
out.close();
}
}
}
updateServlet.java
------------------
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
package servletPackage;
import java.io.*;
import java.util.Enumeration;
import javax.servlet.ServletException;
import javax.servlet.http.*;
import util.Escape;
public class updateServlet extends HttpServlet {
public void init()
throws ServletException
{
System.out.println("Init() worked");
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//response.setContentType("text/json;charset=UTF-8");
response.setContentType("text/html;charset=UTF-8");
//response.setContentType("application/json;charset=UTF-8");
PrintWriter out = response.getWriter();
try {
Enumeration e =request.getParameterNames();
while (e.hasMoreElements()) {
String key = (String) e.nextElement();
System.out.println(key);
}
StringBuffer s =request.getRequestURL();
System.out.println(s.toString());
String name = request.getParameter("name");
String last = request.getParameter("last");
String hobby = request.getParameter("hobby");
System.out.println("ProcessData began");
name = name+ " save,";
name = Escape.html(name);
last = Escape.html(last);
hobby = Escape.html(hobby);
// for JSON output
name = Escape.javaScript(name);
last = Escape.javaScript(last);
hobby = Escape.javaScript(hobby);
out.println(
"{"
+ " \"name\":" + '"' + name + '"' + ","
+ " \"last\":" + '"' + last + '"' + ","
+ " \"hobby\":" + '"' + hobby + '"'
+ "}");
System.out.println("ProcessData out id="+name);
} finally {
out.close();
}
}
}
deleteServlet.java
listServlet.java
readNextServlet.java
readPrevServlet.java
...
these are similar for the time being.
They will vary when I implement the CRUD using this substructure.
JQMultiAJAXCalls.jsp
--------------------
<%--
Document : index
Created on : 24.Sub.2011, 18:23:21
Author : Ali Riza SARAL
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ARS's Simple JQ CRUD</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.form.js"></script>
<script type="text/javascript" src="js/JQmultiAJAXCalls.js"></script>
<%
System.out.println("index.jsp JSP script began here.");
%>
<SCRIPT>
function InitScr() {
alert ("Merhaba from Ali R+ with best wishes! ");
}
</SCRIPT>
</head>
<body style="background-color:yellow" onLoad="InitScr()">
<h1>The Simplest JQuery CRUD Application</h1>
<br />
<form name="theDetail" action="" method="get">
<input type="hidden" name="id"/><br />
First name: <input type="text" id ="name" name="name"/><br />
Last name : <input type="text" id="last" name="last"/><br />
Hobby : <input type="text" id="hobby" name="hobby"/><br />
<br />
<INPUT TYPE="button" id="New" VALUE="New">
<INPUT TYPE="button" id="Save" VALUE="Save">
<INPUT TYPE="button" id="Delete" VALUE="Delete">
<INPUT TYPE="button" id="Next" VALUE="Next">
<INPUT TYPE="button" id="Prev" VALUE="Prev">
<INPUT TYPE="button" id="List" VALUE="List">
</form>
</body>
</html>
JQMultiAJAXCalls.js
-------------------
$(document).ready(function() {
// Handler for .ready() called.
$(function() {
$("input#New").click(function() {
var name = $("input#name").val();
var last = $("input#last").val();
var hobby = $("input#hobby").val();
alert('New is clicked dataString='+name);
var aoData = [];
aoData.push( { "name": "name", "value": name },
{"name": "last", "value": last },
{"name": "hobby", "value": hobby }
);
$.ajax({
type:"POST",
url: "./new",
contentType: "application/x-www-form-urlencoded",
dataType: "JSON",
data: aoData,
error : function (XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest);
alert(textStatus);
alert(errorThrown)},
success: function(data) {
var jsonData = $.parseJSON(data);
$("input#name").val(jsonData.name)
$("input#last").val(jsonData.last)
$("input#hobby").val(jsonData.hobby)
}
})
return false;
})
})
$(function() {
$("input#Save").click(function() {
var name = $("input#name").val();
var last = $("input#last").val();
var hobby = $("input#hobby").val();
alert('Save is clicked name='+name);
var aoData = [];
aoData.push( { "name": "name", "value": name },
{"name": "last", "value": last },
{"name": "hobby", "value": hobby }
);
$.ajax({
type:"POST",
url: "./save",
contentType: "application/x-www-form-urlencoded",
dataType: "JSON",
data: aoData,
error : function (XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest);
alert(textStatus);
alert(errorThrown)
},
success: function(data) {
var jsonData = $.parseJSON(data);
$("input#name").val(jsonData.name)
$("input#last").val(jsonData.last)
$("input#hobby").val(jsonData.hobby)
}
})
return false;
})
})
$(function() {
$("input#Delete").click(function() {
...
$(function() {
$("input#Next").click(function() {
...
$(function() {
$("input#Prev").click(function() {
...
$(function() {
$("input#List").click(function() {
...
});
package util;
import org.apache.commons.lang.*;
public class Escape {
public static String html(String input) {
return StringEscapeUtils.escapeHtml(input);
}
public static String javaScript(String input) {
return StringEscapeUtils.escapeJavaScript(input);
}
public static String lineBreakToBr(String input) {
return input.replaceAll("\\n", "<br />");
}
public static String paragraphBreakToBrs(String input) {
return input.replaceAll("\\n\\s*\\n", "<br /><br />");
}
}