New To Ajax - getting PHP $_SESSION information from without reloading?

[bsprogs]

I have my own little file hosting website and once a file has been displayed, it give you a link to "Get Link codes" which will supply the BB and HTML code for the file you just uploaded.

 

Here is a list of the files I'm using:

ajax.js

upload.php

linkcodes.php

 

I have my first file ajax.js

var XMLHttpRequestObject = false;

if (window.XMLHttpRequest) {
XMLHttpRequestObject = new XMLHttpRequest();
} else if (window.ActiveXObject){
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}

function getLinkCodes(datasource, divID){
if (XMLHttpRequestObject) {
	var obj = document.getElementById(divID);
	obj.innerHTML = "Loading...";
	XMLHttpRequestObject.open("GET", datasource);

	XMLHttpRequestObject.onreadystatechange = function(){
		if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200){
			obj.innerHTML = XMLHttpRequestObject.responseText;
		}
	}
	XMLHttpRequestObject.send(null);
}
}

 

That has worked with general tests to change the content on the page so I know the code works.

 

Now here is the hard part. Once a file has been uploaded, the script stores a special string on a $_session Variable in PHP.

Then once "Get Link Codes" is clicked, it will load linkcodes.php like this

<span class=\"link\" onclick=\"getLinkCodes('tpl_linkcodes.php','maincontainer')\" style=\"font-size: 8px;\">Get Link Codes</span>

 

When I click the link, the linkcodes.php page loads in the maincontainer just like it is supposed to. However, this is where I have a problem

 

linkcodes.php looks something like this:

<script>
alert('testing');
</script>
<textarea rows="15" cols="100" id="link_codes" name="link_codes" style="padding: 2px;"></textarea>

 

The text area will load with "Info" inside it however, the alert will not pop up, nor can I print any session data that is stored in the $_session variable I was talking about earlier.

I tested the code with a normal link, refreshing the page and everything and it worked like a charm. It's only when I run it without the page refresh that it wont work.

 

Any ideas?

[bibby]

Hi bsprogs,

I've recently solved this problem myself [and help from dav the gook]. You can have ajax return executable javascript, but not with html script tags.

The magic line in your code is in getLinkCodes()

obj.innerHTML = XMLHttpRequestObject.responseText;

 

Don't consider the content of responseText as whole elements, just a plain string.

We could fork this line, and separate out the parts we are using as replacement html, and executable javascript.

 

First, I'm going to change the output of linkcodes.php to look like the following. This does not have to be valid syntax because I'm going to parse this string again. I used a triple pipe , '|||' , as a delimiter. I'm also putting the javascript at the end since you may not use it all of the time.

 

<textarea rows="15" cols="100" id="link_codes" name="link_codes" style="padding: 2px;"></textarea>|||alert('testing');

 

 

So now responseText can be split (javascript equivilent to php's explode() ). If we find something behind the delimiter, it gets eval()'d. A good thing to do is make all of your necessary functions available early on, and then have ajax return minimal instructions.

 

function getLinkCodes(datasource, divID)
{
if (XMLHttpRequestObject) 
        {
	var obj = document.getElementById(divID);
	obj.innerHTML = "Loading...";
	XMLHttpRequestObject.open("GET", datasource);

	XMLHttpRequestObject.onreadystatechange = function()
               {
		if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200)
                        {
                               var rtext =  XMLHttpRequestObject.responseText.toString(); //just in case
                               var components  = rtext.split('|||');
                               
                                //set html
                               	obj.innerHTML = XMLHttpRequestObject.components[0];

                                 //exec js !
                               if (typeof(components[1])!='undefined'){ eval(components[1];};
		}
	}
	XMLHttpRequestObject.send(null);
}
}

 

 

To take it to the next level (based on the title of this post), the second half of your return string (right side of the |||) can be whole javascripts and have php generated value.

linkcodes.php

<?
$html ='<textarea rows="15" cols="100" id="link_codes" name="link_codes" style="padding: 2px;"></textarea>';
$js = ' alert("your session has '.sizeof($_SESSION).' variables");' ;

echo $html . '|||'. $js; 
?>

?>

[bsprogs]

Hmm, I tried your suggestion but no luck. I still can't even get the $_SESSION['variable'] information back from the server.

When not using ajax but a normal link, it'll show the variable is set. However, when loading that same page in AJAX, it shows up blank.

[roopurt18]

Are you calling session_start() at the top of the script the AJAX is pointing at?