Retrieve data from other server using JavaScript

[Ajay Shilwant]

Hi,
I am develop a JavaScript, using this java script build a form & table grid on Html page...
(this java script call from other server...) and html page is on my local machine,
using this java script, run time complete HTML page is build but onclick of search button function is call & other server process is done, but result is not return...


JavaScript File

/* @author ajay
@date 16 Feb 2012
using this function clear text box SendSearchRequest()
Main Function

*/

function displayShipmentScreen()
{
//alert("Welcome!...");
var searchField = "<div class='main'><form><div class='main1'><table><tr><td colspan='30'><h3>Shipment Search</h3></td></tr><tr><td width='8%'>Origin ST</td><td width='9%'>Origin City</td><td width='8%'>Origin Zip</td><td width='8%'>Dest. ST</td><td width='8%'>Dest. City</td><td width='8%'>Dest. Zip</td><td align='center' colspan='2'>Pickup Date Range(mm/dd/yyyy)</td><td width='12%'>Equipment Type</td><td width='24%'>Equipment Length</td></tr><tr><td><input type='text' size='5' name='OriginSt' id='OrginSt'></td><td><input type='text' size='8' name='OriginCityNew' id='OriginCityNew'></td><td><input type='text' size='8' name='OriginZip' id='OriginZip'></td><td><input type='text' size='4' name='DestSt' id='DestSt'></td><td><input type='text' size='8' name='DestCity' id='DestCity'></td><td><input type='text' size='8' name='DestZip' id='DestZip'></td><td><input type='text' id='my_date_field1' name='pdate1' class='datepicker' size='8' autocomplete='off' readonly/><script language='javascript'>new Control.DatePicker('my_date_field1', { icon: 'images/calendar.png' });</script></td><td><input type='text' id='my_date_field2' name='pdate2' class='datepicker' size='8' autocomplete='off' readonly/><script language='javascript'>new Control.DatePicker('my_date_field2', { icon: 'images/calendar.png' });</script></td><td><select id='EquipType' name='EquipType' title='Equip Type' style='width:50px;'><option></option></select></td><td><select id='EquipLength' name='EquipLength'><option></option></select></td></tr></table>"

//alert(searchField);

var searchFieldButton = "<table width='72%' height='43'><tr><td width='11%'><input type='button' value=' Search ' onclick='return SendSearchRequest();'></td><td width='11%'><input type='reset' value=' Reset ' onclick='doClear();' ></td><td width='78%'> </td></tr></table></form></div>"
alert(searchFieldButton);


var grid = "<div id='ShowSearchResult'><table class='new1' border='1'><thead><tr><td colspan='16'></td></tr><tr><th><h4>Origin City</h4></th><th><h4>Origin ST</h4></th><th class='new'><h4>Destination City</h4></th><th class='new'><h4>Dest. ST</h4></th><th class='new'><h4>Pickup Date</h4></th><th class='new'><h4>Miles</h4></th><th class='new'><h4>Equipment Type</h4></th><th class='new'><h4>Equipment Length</h4></th><th class='new'><h4>Shipment No.</h4></th><th class='new'><h4>Contact Email</h4></th><th class='new'><h4>Contact No.</h4></th></tr></thead></table></div>"



document.getElementById("show").innerHTML=searchField + searchFieldButton + grid;

}

function SendSearchRequest()
{
//alert("welcome in SendSearchRequest...");
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}

// using this function replace space & trim right & left (rtrim & ltrim)
function trim (str) {
return str.replace(/^\s*/g, '').replace(/\s*$/g, '');
}

// read form enter values
var ControllingOrgCode = "2801"; //trim(document.getElementById("ControllingOrgCode").value);
var OriginSt = trim(document.getElementById("OrginSt").value);
var OriginCityNew = trim(document.getElementById("OriginCityNew").value);
var OriginZip = trim(document.getElementById("OriginZip").value);
// var OriginRadious = trim(document.getElementById("OriginRadious").value);
var DestSt = trim(document.getElementById("DestSt").value);
var DestCity = trim(document.getElementById("DestCity").value);
var DestZip = trim(document.getElementById("DestZip").value);
//var DestRadious = trim(document.getElementById("DestRadious").value);

var pdate1=trim(document.getElementById("my_date_field1").value);
var pdate2=trim(document.getElementById("my_date_field2").value);

if(pdate1=="" && pdate2==""){
//alert("blank");
}
else{
pdate1 = dateFormat(pdate1, "isoDate");
pdate2 = dateFormat(pdate2, "isoDate");
//alert(pdate1);
//alert(pdate2);

}
//alert(pdate1);
//alert(pdate2);

var EquipType = trim(document.getElementById("EquipType").value);
var EquipLength = trim(document.getElementById("EquipLength").value);

var url="http://localhost:8080/smartLMS/AvailableLoad/getinfo_old.jsp"
//var url="http://ServerIP:9090/smartLMS/AvailableLoad/getinfo_old.jsp"



//url varible with backend Jsp Page....
//url=url+"?ControllingOrgCode="+ControllingOrgCode+"&OriginSt="+OriginSt+"&OriginCityNew="+OriginCityNew+"&OriginZip="+OriginZip+"&OriginRadious="+OriginRadious+"&DestSt="+DestSt+"&DestCity="+DestCity+"&DestZip="+DestZip+"&DestRadious="+DestRadious+"&pdate1="+pdate1+"&pdate2="+pdate2+"&EquipType="+EquipType+"&EquipLength="+EquipLength
url=url+"?ControllingOrgCode="+ControllingOrgCode+"&OriginSt="+OriginSt+"&OriginCityNew="+OriginCityNew+"&OriginZip="+OriginZip+"&DestSt="+DestSt+"&DestCity="+DestCity+"&DestZip="+DestZip+"&pdate1="+pdate1+"&pdate2="+pdate2+"&EquipType="+EquipType+"&EquipLength="+EquipLength

//alert(url);
xmlHttp.onreadystatechange=displaySearchResults //displaySearchResults
xmlHttp.open("GET",url,true) //send url...
xmlHttp.send(null)
//var showdata = xmlHttp.responseText;
//alert("Show Data : "+showdata);
}
//getAvalableShipmentScreen
//displayShipmentScreen

//return data display by using this function... //displaySearchResults
function displaySearchResults()
{
alert("I am here!.. displaySearchResults");
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
var showdata = xmlHttp.responseText;
//alert("Show Data in f : "+showdata);
var strar = showdata.split(":");
alert(strar);
var d=strar[1];
d=d-1;

//alert("value of dd: "+d);
var str1=strar[1];var str2=strar[2];var str3=strar[3];var str4=strar[4];var str5=strar[5];var str6=strar[6];
var str7=strar[7];var str8=strar[8];var str9=strar[9];


//alert(str1+" "+str2+" "+str3+" "+str4+" "+str5+" "+str6+" "+str7+" "+str8);



var ans1="<table width='100%' border='1'><thead><tr><td colspan='16'><h3 align='left'>Shipment Search Result (Total Shipment found : "+strar[1]+")</h3></tr><tr>"+
"<th><h4>Origin City</h4></th><th><h4>Origin St.</h4></th>"+
"<th><h4>Destination City</h4></th><th><h4>Dest. St</h4></th>"+
"<th><h4>Pickup Date</h4></th>"+
"<th><h4>Miles</h4></th><th><h4>Equipment Type</h4></th>"+
"<th><h4>Equipment Length</h4></th><th><h4>Shipment No.</h4></th><th><h4>Contact Email</h4></th><th><h4>Contact No.</h4></th>"+
"</tr></thead>"


var y=11; //Shipment No.
var a=12; //Origin City
var b=13; //Origin State Cd
//var c=14; // Origin zip
var d1=15; //Destination City
var e=16; // Destinatio State Code
//var f=17; // Destination Zip
var g=18; //Pickup Date
//var h=19; //Delivery Date
var i1=20; //Miles
var j=21; //Equipment type
var k=22; //Equipment Length
var l=23; //email.
var m=24; //number
var n=0;

var str=strar[2];

var ans2 ="";
var i = 0;
var ans0=""

// loop to display values....
while(i<d+1)
{
ans2=ans2+"<tr><td>"+strar[a]+"</td><td>"+strar+"</td><td>"+strar[d1]+"</td>"+
"<td>"+strar[e]+"</td><td>"+strar[g]+"</td><td>"+strar[i1]+"</td><td>"+strar[j]+"</td><td>"+strar[k]+"</td><td>"+strar[y]+"</td><td>"+strar[m]+"</td><td>"+strar[l]+"</td></tr>";
//alert(ans2);
//<td>"+strar[h]+"</td> <td>"+strar[c]+"</td> <td>"+strar[f]+"</td>
i++;
y=y+29;
a=a+29;
b=b+29;
//c=c+28;
d1=d1+29;
e=e+29;
//f=f+28;
g=g+29;
//h=h+28;
i1=i1+29;
j=j+29;
k=k+29;
l=l+29;
m=m+29;
n=n+0;

}
var ans3 ="</table>";
// alert("ANS1 : "+ans1);
// alert("ANS2 : "+ans2)
//
//alert("ANS3 :"+ans3);
document.getElementById("ShowSearchResult").innerHTML=ans0+ans1+ans2+ans3;
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{

xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}






[b]HTML page:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link href="css/datepicker.css" rel="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>





<script type="text/javascript" src="http://localhost:8080/smartLMS/AvailableLoad/js/buildSearch.js"></script>

</head>
<body>
<h4>Welcome- call external javsScript Function...</h4>
<div id="show"></div>
<script>
window.onload=displayShipmentScreen();
</script>



</body>
</html>

[Eric Pascarello]

way too much code to go through. When you post code, use code tags so it is formatted nicer.

lucky I happened to spot this:

window.onload=displayShipmentScreen(); 

That is wrong.

Eric