Hi I only use HTML and javascript with Windows 7. I am new to javascript and I would very much appreciate help with the basic below code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Contacts</title>
<link rel="stylesheet" type="text/css" href="mystyles.css" title="Style"></link>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" language = "javascript">
function loadXMLDoc(dname)
{
if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest();
}
else
{
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET",dname,false);
xhttp.send();
return xhttp.responseXML;
}
function getContacts()
{
xmlDoc=loadXMLDoc("contact.xml");
x=xmlDoc.getElementsByTagName("first");
// get the value from the field
myString = document.getElementById("searchName").value;
//find the length of the string
size = myString.length;
//set up the initial part of the table - heading
divText = "<table class='border'> <tr bgcolor='#9acd32'><h2>Details of Contact:</h2><br/><td>First Name</td><td>Last Name</td><td>Street</td><td>City</td><td>State</td><td>Postcode</td><td>Country</td><td>Phone</td></tr>";
//loop comparing and finding related elements based on the variable entered on screen
for (i=0; i<x.length;i++)
{
//first node name first
first=xmlDoc.getElementsByTagName("first")[i].childNodes[0].nodeValue;
//create variable where string matches text and size
startString = first.substring(0,size);
//alert ("*" + startString + "&" + myString + "*");
//check if xml variable is the same as entered value
if (startString.toLowerCase() == myString.toLowerCase())
{
// else tell the user no matches were found
// find other related nodes by tag
first=xmlDoc.getElementsByTagName("first")[i].childNodes[0].nodeValue;
last=xmlDoc.getElementsByTagName("last")[i].childNodes[0].nodeValue;
street=xmlDoc.getElementsByTagName("street")[i].childNodes[0].nodeValue;
city=xmlDoc.getElementsByTagName("city")[i].childNodes[0].nodeValue;
state=xmlDoc.getElementsByTagName("state")[i].childNodes[0].nodeValue;
postcode=xmlDoc.getElementsByTagName("postcode")[i].childNodes[0].nodeValue;
country=xmlDoc.getElementsByTagName("country")[i].childNodes[0].nodeValue;
phone=xmlDoc.getElementsByTagName("phone")[i].childNodes[0].nodeValue;
// display data in table
divText = divText + "<tr bgcolor='##ffffff'><td>" + first + "</td><td>" + last + "</td><td>" + street + "</td><td>" + city + "</td><td>" + state + "</td><td>" + postcode + "</td><td>" + country + "</td><td>" + phone + "</td></tr>";
//alert(divText);
}
}
//end table
divText = divText + "</table>";
//send html object to div tag for display
document.getElementById("resultshere").innerHTML= divText;
}
</script>
</head>
<body>
<!-- field box and button to search data -->
<h1 align="center">SEARCH FOR CONTACTS</h1>
<br/>
<br/>
<br/>
Please enter your contacts First Name: <input type="text" id="searchName" />
<button onClick="getContacts()">Submit</button>
</br>
<br/>
<br/>
<div id="resultshere">
</div>
</body>
</html>