Jump to content

Variables

user4fun

By user4fun
in JavaScript

Recommended Posts

user4fun Invested Member

user4fun

Posted
Posted

(I dont kow why this was posted twice, sorry)This is driving me crazy, i cannot find one simple, and i mean simple example for this.A php file (test.php) does a bunch of stuff and at the end it echo a variable. ($got_it)another page which is an htm (display.htm)i just need to ask it to run the test.php and get the $got_it and then display it?ther are no forms like teh 10k example on line, ther are no complex stuffust get the variable and display it.

Link to comment
Share on other sites
justsomeguy w3schools Guru

justsomeguy

Posted
Posted

This was adapted from the AJAX tutorial on the w3schools site.You need some Javascript code to create the XMLHTTPResponse object, send the request to test.php, get the response back (the variable), and display it. People just use forms as examples, you don't need to use a form, you just need to have some trigger or event that executes the Javascript.

<html>  <head>	<script type="text/javascript">	var xmlHttp;	try	{	  // Firefox, Opera 8.0+, Safari	  xmlHttp=new XMLHttpRequest();	}	catch (e)	{	  // Internet Explorer	  try	  {		xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");	  }	  catch (e)	  {		try		{		 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");		}		catch (e)		{		  alert("Your browser does not support AJAX!");		  return false;		}	  }	}	function ajaxFunction()	{	  xmlHttp.onreadystatechange=function()	  {		if(xmlHttp.readyState==4)		{		  document.getElementById("response_text").innerHTML = xmlHttp.responseText;		}	  }	  xmlHttp.open("POST","test.php",true);	  xmlHttp.send(null);	}	</script>  </head>  <body>	<a href="java script:void(0);" onclick="ajaxFunction();">Send request</a>	<br>	<div id="response_text"></div>  </body></html>

Link to comment
Share on other sites
user4fun Invested Member

user4fun

Posted
  • Author
Posted

i figured outwhat i am doing but it is a total disaster, feel free to toss inwhat help any one might have. thank you all

<html><body><script type="text/javascript">function GetInfo()   var t = 0  while (t<=10)	   {		  var xmlHttp;		   try		   {		   xmlHttp=new XMLHttpRequest();		   }		   catch (e)		  {		   try		 {		   xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");		   }		 catch (e)		 {		  try		  {		xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");		  }		catch (e)		 {		 alert("Your browser does not support AJAX!");		  return false;		}	  }	}	xmlHttp.onreadystatechange=function()	  {	  if(xmlHttp.readyState==4)		  {picked_file=window.open("http://+xmlHttp","_blank","toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=400, height=200")		 t=t+1		 setTimeout(3000)		 picked_file=window.close();		 }	  }		 xmlHttp.open("GET","get_info.php",true);		 xmlHttp.send(null);	 }}</script><form name="myForm">Get it: <input type="button" onClick="GetInfo();" name="start" value="Start" />Stop it: <input type="button" onClick="stop.GetInfo();" name="stop" value="Stop" /></form></body></html>

Offcourse you can tell is is a disaster and it will not work,the ideaWhile the variable t is =<10get the variable form the php file get_info.phpopen it in a new windowwait 3 secondsclose the windowand then ask for another value form the get_info.php filein the form the stop button is to terminate the function incase the user did not wait for all 10 files. that is not properly coded either.I am horrible at this, i am doing my own project and i would really appreciatethe help of the professional community.

Link to comment
Share on other sites
Synook w3schools Guru

Synook

Posted
Posted

It is not that bad, just change the xmlHttp.onreadystatechange function to this:

xmlHttp.onreadystatechange=function() {	if(xmlHttp.readyState==4) {		picked_file=window.open("http://" + xmlHttp.responseText,"picked_file","toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=400, height=200");		t++;		setTimeout("picked_file.close(); GetInfo(" + t + ");",3000);	}}

Change the top of the GetInfo function to look like this:

function GetInfo(t) {	//Add the argument t, and an opening brace!	//Get rid of the t=0 statement	if (t <= 10)	//Change 'while' to 'if'		{	//Continue as normal

And finally, change the buttons to look like this:

Get it: <input type="button" onClick="GetInfo(1);" name="start" value="Start" />Stop it: <input type="button" onClick="GetInfo(11);" name="stop" value="Stop" />

This all basically means that it will increment the t variable every time the function runs, and then wait 3000 ms before closing the window and calling the function again with an incremented value of t. So, it will call the function like so: GetInfo(1); [wait 3000 ms] GetInfo(2); [wait 3000 ms] Etc...To stop the script, it simply calls it with a t of eleven, and therefore causes the if (t <= 10) to fail, and the script not to run and not to call itself.

Link to comment
Share on other sites
user4fun Invested Member

user4fun

Posted
  • Author
Posted

cool, Thank you, it did not work for a few miutes bucaeuse i had one to many }.Thank you very much.how much different would it be if i choose to change the url address after 3secs instead of open then closeThe stop button only works when 11 t take palce, what if the user chooses to stop before taht, it is not working

Link to comment
Share on other sites
justsomeguy w3schools Guru

justsomeguy

Posted
Posted

The stop button needs to clear the timeout that was set earlier.You shouldn't have this in a loop though, it would work better to just use timeouts. If you go back to the original code I posted, you would need to add a timeout variable at the global level so that all functions can access the timeout, and then change the ajaxFunction function to set a timeout to call itself. The stop button will only need to clear the timeout.

	<script type="text/javascript">	var opened_win = null;	var xmlHttp;	var timeout;	try	{	  // Firefox, Opera 8.0+, Safari	  xmlHttp=new XMLHttpRequest();	}	catch (e)	{	  // Internet Explorer	  try	  {		xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");	  }	  catch (e)	  {		try		{		 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");		}		catch (e)		{		  alert("Your browser does not support AJAX!");		  return false;		}	  }	}	function ajaxFunction()	{	  xmlHttp.onreadystatechange=function()	  {		if(xmlHttp.readyState==4)		{		  opened_win = window.open("http://" + xmlHttp.responseText,"opened_win","toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=400, height=200");		  opened_win.focus();		}	  }	  xmlHttp.open("POST","test.php",true);	  xmlHttp.send(null);	  timeout = setTimeout("ajaxFunction", 3000);	}	</script>

Also, it's not necessary to close the window every time if you use a window name. If you use a window name then it will always open the page in the same window. This won't open 10 windows for 10 links, it will open one window and use the same one for all 10 links.If you want to put a limit on the number of links to open (like 10), then you would also include a global counter that the ajaxFunction would increment every time it runs. If the counter is over a certain number, then the ajaxFunction would stop. So you would add this to the top with the other global variables:var nr_opened = 0;And then change the ajaxFunction like this:

	function ajaxFunction()	{	  if (++nr_opened >= 10)		return;	  xmlHttp.onreadystatechange=function()	  {		if(xmlHttp.readyState==4)		{		  opened_win = window.open("http://" + xmlHttp.responseText,"opened_win","toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=400, height=200");		  opened_win.focus();		}	  }	  xmlHttp.open("POST","test.php",true);	  xmlHttp.send(null);	  timeout = setTimeout("ajaxFunction", 3000);	}

Also, your buttons would look like this:<input type="button" onclick="ajaxFunction();" name="start" value="Start"><input type="button" onclick="clearTimeout(timeout);" name="stop" value="Stop">

Link to comment
Share on other sites
jhecht Invested Member

jhecht

Posted
Posted

if you want an easier AJAX object, that takes out pretty much all the guess work, try looking into Mootool's AJAX object. The documentation is located http://docs.mootools.net/Remote/Ajax.js . It saves me time. Also, the mootools library is great for just about any javascript functioning. It takes a lot of work out of what you have to do. Thats what i'd recommend. Read through the entire documentation(if you have time or patience enough). You'll see there's a real quick way to do what you're trying to do within MooTools, i'm sure.

Link to comment
Share on other sites
user4fun Invested Member

user4fun

Posted
  • Author
Posted

just some guy,thankx for the code, i am working on the last error, there is ewror on page when i click startAlsoHow would the xmlHttp.open("POST","get_info.php",true);be different fromxmlHttp.open("GET","get_info.php",true);either way the php file print $thevariable;

  <html> <body> <script type="text/javascript">	var opened_win = null;	 var timeout;	var nr_opened = 0;	var xmlHttp;	try	{		 xmlHttp=new XMLHttpRequest();	}	catch (e)	{	  	  try	  {		xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");	  }	  catch (e)	  {		try		{		 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");		}		catch (e)		{		  alert("Your browser does not support AJAX!");		  return false;		}	  }	}	 function ajaxFunction()	{	  if (++nr_opened >= 10)		return;	  xmlHttp.onreadystatechange=function()	  {		if(xmlHttp.readyState==4)		{		  opened_win = window.open("http://" + xmlHttp.responseText,"opened_win","toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=400, height=200");		  opened_win.focus();		}	  }	  xmlHttp.open("POST","get_info.php",true);	  xmlHttp.send(null);	  timeout = setTimeout("ajaxFunction", 7000);	}	</script><form><input type="button" onclick="ajaxFunction();" name="start" value="Start"><input type="button" onclick="clearTimeout(timeout);" name="stop" value="Stop"> </form></body></html>

Link to comment
Share on other sites
jesh Devoted Member

jesh

Posted
Posted

The first problem that pops up is the "return false" in the try/catch business. Since that code is not in a function, the interpreter fails when it sees the "return". You might start by removing that.Also, I may be mistaken about this but, I think that the browser and/or the webserver may have a hard time accepting a POST request that sends "null" data. Either send an empty string or change your method to GET.

Link to comment
Share on other sites
jesh Devoted Member

jesh

Posted
Posted

Try changing your readystatechange handler to this:

xmlHttp.onreadystatechange=function(){	if(xmlHttp.readyState==4)	{		if(xmlHttp.status == 200)		{			opened_win = window.open("http://" + xmlHttp.responseText,"opened_win","toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=400, height=200");			opened_win.focus();		}		else		{			alert("There was an error.  " + xmlHttp.statusText);		}	}}

When I run that in the TryIt pages with the xmlHttp.send(null) line, I get "Length Required" as the error. Changing that line to xmlHttp.send("") returns "Not Found" which simply tells me, accurately, that "get_info.php" doesn't exist on the w3schools site.Modifying your code so that the window.open only executes on a successful AJAX request and having some type of error reporting on failure should help you debug your script.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...