// Make a POST to the server 
// and pass on any data from browser
// via the XMLHTTPRequest

function talktoServer(){
	var req = newXMLHttpRequest();
	//register the callback handler function
  	var callbackHandler = getReadyStateHandler(req, updateMsgOnBrowser);
  	req.onreadystatechange = callbackHandler;
  	req.open("POST", "ajaxserver.php", true);
  	req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  	//get the value from the text input element and send it to server
  //	var testmsg = document.getElementById("testmsg");
  //	var msg_value = testmsg.value;
	  var sys=0;
  	  if (document.form1.A1[0].checked) { sys=0}  
  	  if (document.form1.A1[1].checked) { sys=1}  
  	  if (document.form1.A1[2].checked) { sys=2}  
  	  if (document.form1.A1[3].checked) { sys=3}  
  	  if (document.form1.A1[4].checked) { sys=4}  
	  var raid=1;
	  if (document.form1.B1[0].checked) { raid=0}  
  	  if (document.form1.B1[1].checked) { raid=1}  
  	  if (document.form1.B1[2].checked) { raid=2}  
  	  if (document.form1.B1[3].checked) { raid=3} 
	  var drive2=0;
	  if (document.form1.C1[0].checked) { drive2=0}  
  	  if (document.form1.C1[1].checked) { drive2=1}  
  	  if (document.form1.C1[2].checked) { drive2=2}  
	  var sz2=0;
 	  if (document.form1.D1[0].checked) { sz2=0}  
  	  if (document.form1.D1[1].checked) { sz2=1}  
  	  if (document.form1.D1[2].checked) { sz2=2}  
 	  if (document.form1.D1[3].checked) { sz2=3}  
  	  if (document.form1.D1[4].checked) { sz2=4}  
  	  if (document.form1.D1[5].checked) { sz2=5} 
	  var opt1=0;
	  var opt2=0;
	  var opt3=0;
  	  if (document.form1.E1[0].checked) { opt1=1}  
  	  if (document.form1.E1[1].checked) { opt2=1}  
  	  if (document.form1.E1[2].checked) { opt3=1}  
  
	  req.send("A1="+sys+"&B1="+raid+"&C1="+drive2+"&D1="+sz2+"&E1="+opt1+"&E2="+opt2+"&E3="+opt3);
}

// This is the callback functions that gets called
// for the response from the server with the XML data


function updateMsgOnBrowser(testXML) {

	//Get data from XML
	var image = testXML.getElementsByTagName("image")[0];
	var name = testXML.getElementsByTagName("name")[0];
	var price = testXML.getElementsByTagName("price")[0];
	var description = testXML.getElementsByTagName("description")[0];
	var from_price = testXML.getElementsByTagName("from_price")[0];
	var raid_data = testXML.getElementsByTagName("raid_data")[0];
	var raid_image = testXML.getElementsByTagName("raid_image")[0];
	var drive_image = testXML.getElementsByTagName("drive_image")[0];
	var drive_data = testXML.getElementsByTagName("drive_data")[0];

	
	//Get value from data above
	var vimage = image.firstChild.nodeValue;
	var vname = name.firstChild.nodeValue;
	var vprice = price.firstChild.nodeValue;
	var vdescription = description.firstChild.nodeValue;
	var vfrom_price = from_price.firstChild.nodeValue;	
	var vraid_data = raid_data.firstChild.nodeValue;	
	var vraid_image= raid_image.firstChild.nodeValue;	
	var vdrive_image= drive_image.firstChild.nodeValue;	
	var vdrive_data= drive_data.firstChild.nodeValue;	

	//Display data into web browser on span ID

	var aaa = document.getElementById("image2").innerHTML = "<img src=images/"+vimage+">";
	var bbb = document.getElementById("name").innerHTML = vname;
	var ccc = document.getElementById("price").innerHTML = "$"+vprice;
	var ddd = document.getElementById("description").innerHTML = vdescription;
	var eee = document.getElementById("from_price").innerHTML = "FROM: $"+vfrom_price;
	
	var bbb2 = document.getElementById("name2").innerHTML = vname;
	var ccc2 = document.getElementById("price2").innerHTML = "$"+vprice;
	var eee2 = document.getElementById("from_price2").innerHTML = "FROM: $"+vfrom_price;
	
	var fff = document.getElementById("raid_data").innerHTML =vraid_data;
	var ggg = document.getElementById("raid_image").innerHTML ="<a href=http://localhost/images/"+vraid_image+"><img border=0 width=120 src=images/"+vraid_image+"></a>";
	var hhh = document.getElementById("drive_image").innerHTML = "<img src=images/"+vdrive_image+">";
	var iii = document.getElementById("drive_data").innerHTML =vdrive_data;

}


//the following two functions are helper infrastructure to 
//craete a XMLHTTPRequest and register a listner callback function

function newXMLHttpRequest() {
	var xmlreq = false;
	if (window.XMLHttpRequest) {
		xmlreq = new XMLHttpRequest();
	} else if (window.ActiveXObject) {
    		// Try ActiveX
		try { 
			xmlreq = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e1) { 
			// first method failed 
			try {
				xmlreq = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e2) {
				 // both methods failed 
			} 
		}
 	}
   	return xmlreq;
} 

function getReadyStateHandler(req, responseXmlHandler) {
	return function () {
	if (req.readyState == 4) {
		if (req.status == 200) {
        		responseXmlHandler(req.responseXML);
		} else {
			var hellomsg = document.getElementById("hellomsg");
			hellomsg.innerHTML = "ERROR: "+ req.status;
      		}
    	}
 	}
}