Simple Ajax problem

prime · March 15, 2008

ok I'm just starting to learn ajax, so I made a simple php script to query:

<?php

$variable = "PHP Data";

echo "$variable";

?>

As you see nothing fancy just echoing a variable no big deal

but anyhow here's my Ajax/Javascript script I made trying to get it to work, yet I'm not getting anything back, and I'm not exactly sure where I went wrong

<html>

<head><title>Ajax Script</title>



<script type="text/javascript">

var request = null;


funtion createRequest()
	{
		try
			{
				request = new XMLHttpRequest();
			}
				catch(trymicrosoft)
					{
						try
							{
								request = new ActiveXObject("Msxml2.XMLHTTP");
							}
								catch(othermicrosoft)
									{
										try
											{
												request = new ActiveXObject("Microsoft.XMLHTTP");
											}
												catch(failed)
													{
														request = null;
													}
									}
					}
	}

					if(request == null)
						{
							alert("Cannot create Request");
						}


funtion updatePage()
			{
				if(request.readyState == 4)
					{
						var newData = request.responseText;
						var phpdatael = document.getEelementById("phpdata");
						replace.Text(phpdatael, newData);
					}

			}


funtion getdata()
{
	createRequest();
	var serverurl = "server.php";
	request.open("GET", serverurl, true);
	request.onreadystatechange = updatePage;
	request.send(null);
}

</script>

</head><body>

<p>test</p>
<p>The results of the request are <span id="phpdata"></span></p>

<form method="GET">
<input value="get information" type="button" onClick="getdata();" />

</form>

</body>

</html>

prime · March 15, 2008

I realize I am probably making a complete nub mistake but this is my first script, and I've read a lot of tutorials trying to find where I went wrong and well.....

prime · March 15, 2008

Ok I've corrected a spelling mistake I had there so now I have

<html>

<head><title>Ajax Script</title>



<script type="text/javascript">

var request = null;


function createRequest()
	{
		try
			{
				request = new XMLHttpRequest();
			}
				catch(trymicrosoft)
					{
						try
							{
								request = new ActiveXObject("Msxml2.XMLHTTP");
							}
								catch(othermicrosoft)
									{
										try
											{
												request = new ActiveXObject("Microsoft.XMLHTTP");
											}
												catch(failed)
													{
														request = null;
													}
									}
					}
	}

					if(request == null)
						{
							alert("Cannot create Request");
						}


function updatePage()
			{
				if(request.readyState == 4)
					{
						var newData = request.responseText;
						var phpdatael = document.getEelementById("phpdata");
						replace.Text(phpdatael, newData);
					}

			}


function getdata()
{
	createRequest();
	var serverurl = "server.php";
	request.open("GET", serverurl, true);
	request.onreadystatechange = updatePage;
	request.send(null);
}

</script>

</head><body>

<p>test</p>
<p>The results of the request are <span id="phpdata"></span></p>

<form method="GET" action="">
<input value="get information" type="button" onClick="getdata();" />

</form>

</body>

</html>

and I am getting the error cannot create object so obviously I have a problem with that now, sigh

hip_hop_x · March 15, 2008

I'm not sure, i hope i'm not off the subject, but shouldn't it be

request.onreadystatechange = updatePage();

prime · March 15, 2008

still no luck but the source I read said that in that context that JavaScript requires no parenthesis in that situation.

and any help is appreciated as I said this is he first time I've tried to put topgether an Ajax script so :-S

prime · March 15, 2008

I have it creating the object now but still no luck Im not sure why but I dont seem to have any repsonse text, iether that or I'm doing something wrong to display it

<html>

<head><title>Ajax Script</title>



<script type="text/javascript">

var request = null;


function createRequest()
	{
		alert("create request object called");
		try
			{
				request = new XMLHttpRequest();
			}
				catch(trymicrosoft)
					{
						try
							{
								request = new ActiveXObject("Msxml2.XMLHTTP");
							}
								catch(othermicrosoft)
									{
										try
											{
												request = new ActiveXObject("Microsoft.XMLHTTP");
											}
												catch(failed)
													{
														request = null;
													}
									}



					}




							alert(request);


		}


function updatePage()
			{
				if(request.readyState == 4)
					{
						var newData = request.responseText;
						var phpdatael = document.getEelementById("phpdata");
						replace.Text(phpdatael, newData);
						alert(newData);
					}

			}


function getdata()
{
	alert("getdata funtion called");
	createRequest();
	var serverurl = "server.php";
	request.open("GET", serverurl, true);
	request.onreadystatechange = updatePage;
	request.send(null);
}

</script>

</head><body>

<p>test</p>
<p>The results of the request are <span id="phpdata"></span></p>

<form method="GET" action="">
<input value="get information" type="button" onClick="getdata();" />

</form>

</body>

</html>

prime · March 16, 2008

I have found the response text

<html>

<head><title>Ajax Script</title>



<script type="text/javascript">

var request = null;


function createRequest()
	{
		alert("create request object called");
		try
			{
				request = new XMLHttpRequest();
			}
				catch(trymicrosoft)
					{
						try
							{
								request = new ActiveXObject("Msxml2.XMLHTTP");
							}
								catch(othermicrosoft)
									{
										try
											{
												request = new ActiveXObject("Microsoft.XMLHTTP");
											}
												catch(failed)
													{
														request = null;
													}
									}



					}




							alert(request);


		}


function updatePage()
			{
				if(request.readyState == 4)
					{
						alert("updatepage function called");
						var newData = request.responseText;
						alert("reponse text contains " + newData);
						document.getEelementById('phpdata').innerHTML = request.responseText;

					}

			}


function getdata()
{
	alert("getdata function called");
	createRequest();
	var serverurl = "server.php";
	request.open("GET", serverurl, true);
	request.onreadystatechange = updatePage;
	request.send(null);
}

</script>

</head><body>

<p>test</p>
The results of the request are <span id="phpdata"></span>

<form method="GET" action="">
<input value="get information" type="button" onClick="getdata();" />

</form>

</body>

</html>

now I have no idea how to write it into a page, sorry if it seems I'm writing a lot here but as I'm asking for help I continue searching and trying to find solutions, now I'm in a big problem, not sure what to do sigh

prime · March 16, 2008

Nvm I have the dang thing working sigh

for anyone else having the same problems Hope this helps

<html>

<head><title>Ajax Script</title>



<script type="text/javascript">

var request = null;


function createRequest()
	{
		alert("create request object called");
		try
			{
				request = new XMLHttpRequest();
			}
				catch(trymicrosoft)
					{
						try
							{
								request = new ActiveXObject("Msxml2.XMLHTTP");
							}
								catch(othermicrosoft)
									{
										try
											{
												request = new ActiveXObject("Microsoft.XMLHTTP");
											}
												catch(failed)
													{
														request = null;
													}
									}



					}




							alert(request);


		}


function updatePage()
			{
				if(request.readyState == 4)
					{
						alert("updatepage function called");
						var newData = request.responseText;
						alert("reponse text contains " + newData);
						document.getElementById("phpdata").innerHTML = newData;

					}

			}


function getdata()
{
	alert("getdata function called");
	createRequest();
	var serverurl = "server.php";
	request.open("GET", serverurl, true);
	request.onreadystatechange = updatePage;
	request.send(null);
}

</script>

</head><body>

<p>test</p>
The results of the request are <span id="phpdata"></span>

<form method="GET" action="">
<input value="get information" type="button" onClick="getdata();" />

</form>

</body>

</html>

Sign In

Simple Ajax problem

Recommended Posts

prime

Link to comment

Share on other sites

prime

Link to comment

Share on other sites

prime

Link to comment

Share on other sites

hip_hop_x

Link to comment

Share on other sites

prime

Link to comment

Share on other sites

prime

Link to comment

Share on other sites

prime

Link to comment

Share on other sites

prime

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information