hello,

I am building a site where I want all links to partial page reload using xmlhttprequest and innerhtml. I have done this before, butI always had to have a seperate xmlhttprequest function for each link. So this time I am trying to write just one function, and have the onClick change which document the request is getting. It is not working and I appear to novice to figure out why. Here is the code, i have bolded some relevant lines:

<script type="text/javascript">

function ChangeContent()
{
var whichPHP;
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById('maincontentbox').innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET",whichPHP+".php",true);
xmlhttp.send();
}
</script>

<a href="javascript: ChangeContent()" onclick="whichPHP='contact_us'"><div id="contact_button" class="main_nav">Contact Us</div></a>

am I making a syntax error somewhere, or just screwing the whole thing up altogether?

The website is www.andymacislove.org if that helps at all.

thanks, page

Also, if I use the innerhtml function to write another of these hrefs, will that link be able to access the function if it is in the header, or should I put the entire function in a .js file on the server? The point of all this would be that the entire page never reloads and all the text content is swapped out on demand.

Try to change your hyperlinks as following

<a href="#" onclick="ChangeContent('contact_us')">
  <div id="contact_button" class="main_nav">Contact Us</div>
</a>

Then change the ChangeContent method as

function ChangeContent(pageName)

After that assign the parameter pageName to whichPHP or use pageName in xmlhttp.open

var whichPHP = pageName

That works, thanks for helping a noob out!