PDA

View Full Version : Add AJAX?

birdbrain24
02-05-2008, 03:33 AM
How could i add AJAX to this page so that when the POST methos page is changed it will just get the new include instead of having to reload the page?

Also if it can not work how my page is set up i am willing to change my page to make it work! So if anyone could help please do so!

Thanks!

<html>
<head>
<title>RACE</title>
<link rel="stylesheet" href="style.css" type="text/css">
<script type="text/javascript" src="javascript.js"></script>
</head>
<body>
<?php
# Common functions!
session_start();
include 'functions.php';
connect();
sessioncheck();
lastaction();
?>
<table align="center" cellspacing="5">
<tr>
<td align="right" width="175" style='vertical-align: top; padding: 0px;'><?php require_once 'menu.php'; ?></td>
<td align="center" style='vertical-align: top; padding: 0px;'><?php if(isset($_GET['page'])):

$page = $_GET['page'];
$file_to_include = $page . ".php";

if(file_exists($file_to_include)):

include($file_to_include);

else:

header('Location: index2.php?page=news');

endif;

else:

header('Location: index2.php?page=news');

endif; ?></td>
<td align="left" width="175" style='vertical-align: top; padding: 0px;'><?php require_once 'stats.php'; ?></td>
</tr>
</table>
</body>
</html>
mjlorbet
02-05-2008, 04:10 AM
There are a couple options you could explore. You could either add tags to your php so that when the server side code detects a post back event that it will only return the code within the body tag and on the client side just use document.body.innerHTML = myRequest.responseText in javascript or you could make a second page which is the "post" taget that returns the code to insert between the body tags.

Either way this is not a typical form postback that you need to do. An example for what your looking for is as follows

Javascript:

<script type="text/javascript">
var myRequest = null;
function doPostBack(){
myRequest = new XMLHTTPRequest(); // There are several implementations of this object, you can lookup the detection script pretty much anywhere on here
var myData = "myField1=" + $get("myField1").value + "&myField2=" + $get("myField2").value; // perform some url encoding on this puppy to fix the values to make sure they're safe
myRequest.onreadystatechange = Repopulate;
myRequest.open("POST", URLtoPostTo, true);
myRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
myRequest.setRequestHeader("Content-length", myData.length);
myRequest.setRequestHeader("Connection", "close");
myRequest.send(myData);
}
function Repopulate(){
if((myRequest.readyState == 4) && (myRequest.status == 200))
{
document.body.innerHTML = myRequest.responseText;
}
}
</script>


Granted this way isn't really the best way to do it (actually, as printed it probably won't work for what you're doing at all, but it is the framework to accomplish anything like you described)
birdbrain24
02-05-2008, 04:18 AM
Thanks i give it i try but i don't think ajax will work for what i wants to so i think i am just going to use frames