AJAX new page called to DIV

[drob2689]

Ok, so I asked this same question and did not get on reply so I guess I didnt explain it all that well.

I have an AJAX function which is used so that when u click on a link, it opens a new page within a DIV on my main page. All that works great, but the problem is that there is a form section on my site which cant seem to handle the ajax function, or I don't know how to code it.

basically, the form is held on a page called register.html which loads in a DIV on my main page called 'CONTENT'.

when the form is submitted, the data is sent to register.php, and added to the database. All that works great.

BUT....after this occurs, I want a new page to be loaded in the 'CONTENT' DIV. The new page is confirm.html and it simply holds a confirmation message.

At the moment, all that happens is the whole page is refreshed to show the confirm.html page, where as I just want the div refreshed to show the confirm.html page.

Below is the code, and I swear if anyone can answer this, i will buy u a case of beer or some vodka.

HERE IS THE AJAX FUNCTION

<script type="text/javascript">

var bustcachevar=1 //bust potential caching of external pages after initial request? (1=yes, 0=no)
var loadedobjects=""
var rootdomain="http://"+window.location.hostname
var bustcacheparameter=""

function ajaxpage1(url, containerid){
var page_request = false
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP")
} 
catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
page_request.onreadystatechange=function(){
loadpage(page_request, containerid)
}
if (bustcachevar) //if bust caching of external page
bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
page_request.open('GET', url+bustcacheparameter, true)
page_request.send(null)
}

function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(containerid).innerHTML=page_request.responseText
}

function loadobjs(){
if (!document.getElementById)
return
for (i=0; i<arguments.length; i++){
var file=arguments[i]
var fileref=""
if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
if (file.indexOf(".js")!=-1){ //If object is a js file
fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", file);
}
else if (file.indexOf(".css")!=-1){ //If object is a css file
fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", file);
}
}
if (fileref!=""){
document.getElementsByTagName("head").item(0).appendChild(fileref)
loadedobjects+=file+" " //Remember this object as being already added to page
}
}
}

</script>

HERE IS THE END PART OF THE PHP PAGE

$query = "INSERT INTO users (prefix, firstname, lastname, number, type, email, street, suburb, postcode, city, username, password, password1)VALUES('$prefix', '$firstname', '$lastname', '$number', '$type', '$email', '$street', '$suburb', '$postcode', '$city', '$username', '$password1', '$password2')";
mysql_query($query) or die(mysql_error());

header("Location:confirm.html");
            
mysql_close();
?>

AND THIS IS HOW ID NORMALY CALL A LINK TO A DIV USING THE AJAX FUNCTION

<a href="javascript:ajaxpage1('register.html','content');" class="nav">

[bdl]

When posting code, please be sure to properly format, i.e. indent so we can actually read it.

In this function (which I altered slightly):

function loadpage(page_request, containerid){
    if (page_request.readyState == 4 && (page_request.status==200 ||
           window.location.href.indexOf("http")==-1)) {
        document.getElementById(containerid).innerHTML=page_request.responseText;
    }
}

You're expecting to receive something from the Ajax call and push the content into a DIV element. BUT, your PHP script does this:

PHP Code:

header("Location:confirm.html"); 


The call to header() effectively sends the user to 'confirm.html', bypassing any return value whatsoever. The page is redirected.

If you want some content pushed back to the calling page, then just echo some content. Don't have it redirect or try to send an HTML document.

I can't vouch for any of your other code.