Pages

Sunday, January 23, 2011

Ajax Implementation

Ajax (shorthand for Asynchronous JavaScript and XML) is a group of interrelated web development methods used on the client-side to create interactive web applications. With Ajax, web applications can retrieve data from the server asynchronously in the background without interfering with the display and behavior of the existing page. Data is usually retrieved using the XMLHttpRequest object. Despite the name, the use of XML is not needed, and the requests need not be asynchronous.

Implementation:
Step 1 Jsp part : wrote the following code in JSP where Ajax calls made

var request = false;
try {
request = new XMLHttpRequest();
} catch (trymicrosoft) {
try {
request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (othermicrosoft) {
try {
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (failed) {
request = false;
}
}
}
view raw Ajax_part1 hosted with ❤ by GitHub

above was in <script></script> only.
in the body section
<input type="text" onblur="getXXX(this)" name="pname"/>
function getXXX(passedValue) //CBCM00164946 - Added a method parameter
{
var url = "xxAction.do?operation=99";
request.open("GET", url, true);
request.onreadystatechange = getXXXDetails;
request.send(null);
}
function getXXXDetails ()
{
if (request.readyState == 4)
{
if (request.status == 200)
{
if(getGridRowCount(requirementForm,'Chkbox') == 1 )
{
if(request.responseText == 'NOSRVC')
{
alert('Unable to get XXX details, Check');
document.forms[0].pname.value = "";
}
else if(request.responseText == 'NODATA')
{
alert('Unable to get SIC details');
document.forms[0].pname.value = "";
}
Else
{
SICDtls = request.responseText.split("|");
document.forms[0].sicId.value = SICDtls[0];
document.forms[0].sicDescription.value = SICDtls[2];
}
}else
{
var rowNum = getRowPosition('serialNumber');
if(request.responseText == 'NOSRVC')
{
alert('Unable to get SIC details, Check Serial No and Service Configuration');
document.forms[0].serialNumber[rowNum].value = "";
document.forms[0].sicId[rowNum].value = "";
document.forms[0].sicDescription[rowNum].value = "";
}
else if(request.responseText == 'NODATA')
{
alert('Unable to get SIC details');
document.forms[0].serialNumber[rowNum].value = "";
document.forms[0].sicId[rowNum].value = "";
document.forms[0].sicDescription[rowNum].value = "";
}
Else
{
SICDtls = request.responseText.split("|");
document.forms[0].sicId[rowNum].value = SICDtls[0];
document.forms[0].sicDescription[rowNum].value = SICDtls[2];
}
}//else of grid
}//end request.status ==400
}//end if request.state ==4
}//end function
view raw Ajaxpart2 hosted with ❤ by GitHub

Step 2: Java Part:

xxxAction.java

public static final int OPT_FETCH_SIC_DETAILS = 99;
case OPT_FETCH_SIC_DETAILS:
optFetchSICcode(request, response,equipmentNumberDetailsActionForm);
forwardMapping = null;
break;
.......................
private void optFetchSICcode(HttpServletRequest request, HttpServletResponse response,
xxxActionForm equipmentNumberDetailsActionForm) throws Exception
{
try
{
String serialNo = request.getParameter("serialNo");
long subRequestId = Long.parseLong(request.getParameter("subRequestId"));
System.out.println("subRequestId----------------------"+subRequestId);
SICVO sicVO = model.getSICDetails(serialNo, subRequestId, equipmentNumberDetailsActionForm.getClientContext());
String returnString = "";
response.setContentType("text/plain");
response.setHeader("Cache-Control", "no-cache");
if(sicVO != null && sicVO.getId() >0)
{
returnString = ""+ sicVO.getId() + "|" +sicVO.getCode() +"|"+ sicVO.getDescription();
response.getWriter().write(returnString);
}
else
{
returnString = returnString +"NOSRVC";
response.getWriter().write(returnString);
}
}
catch(Exception e)
{
response.getWriter().write("NODATA");
}
}
view raw ajaxAction hosted with ❤ by GitHub
 ..,,,,,
And forward mapping to NULL.





No comments:

Post a Comment