[SOLVED] Dynamically Include PHP File - JS Question

Ryuujin · August 2, 2008

Greetings, this has been bothering me for a VERY VERY long time and I can't get it to work no matter what I try and I can't get anyone to help. :\

I am not very good with JS and only know some VERY basic stuff.

Anyway, first I will describe the problem.

I have this JS code that will dynamically load a page into a div. This code is for my game. I have it setup so when they click the link "Chop Wood" it loads woodcutting.php into the div "content" dynamically. Now, on woodcutting.php I have some very basic code. There is also some Javascript, well, the javascript wont run at all. Not even something as simple as alert().

Now here is my code:

Header Javascript - This is included in the header.php file inside the "<head>" tags.

	function ajaxpage(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
	}

Forest.php

<?php 
include('header.php');
?>
<?php
if($location['forest'] == 1) {
?>
<h2><?php echo $location['name']; ?> Forest</h2>
<p>Welcome to the <?php echo $location['name']; ?> Forest. Please select an action below.</p>
<p>
<a href="#" onClick="ajaxpage('woodcutting.php', 'content');">Chop Wood</a>
</p>
<?php
} else {
?>
<p>Sorry Traveler, there is no forest here.</p>
<?php
}
?>
<?php include('footer.php'); ?>

Now all that works, including the link, now here is woodcutting.php

<script type="text/javascript">
function reload() {
	ajaxpage('game.php', 'content');
}

alert("no!");
</script>
Test

It loads it up, the displays Test as the code, but does not display the alert. If I run this file directly, it works fine. (The reload() function is something else and does not effect the code, I already tried removing it.)

This is INCREDIBLY annoying and has stopped all development. I need Javascript to work, or the project wont work.

I have tried including the JS in the header file, including as an external file etc.

Any help is GREATLY appreciated.

Sincerely,

-Marcus

Xurion · August 2, 2008

For starters, replace your body tag with the following:

<body onload="alert('JS is working');">

Just to see if javascript is turned on.

Ryuujin · August 2, 2008

It is, trust me.

If I dynamically load the page with AJAX it wont work, but if I load it directly, it works fine.

Psycho · August 2, 2008

I've never tried it, but I doubt that you can inject JavaScript into a page using innerHTML and expect it to work. But there are ways to dynamically add javascript to a page. Here is one possibility:

First, on the main page create a script tag as follows:

<script type="text/javascript" id="ajaxJS"></script>

You can then dynamically add javascript using somethign like this:

document.getElementById('ajaxJS').src = 'somefile.js'

Ryuujin · August 2, 2008

I've never tried it, but I doubt that you can inject JavaScript into a page using innerHTML and expect it to work. But there are ways to dynamically add javascript to a page. Here is one possibility:

First, on the main page create a script tag as follows:
<script type="text/javascript" id="ajaxJS"></script>
You can then dynamically add javascript using somethign like this:
document.getElementById('ajaxJS').src = 'somefile.js'

Hmm, it didn't work

Ryuujin · August 2, 2008

I got it to work by adding this:

		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
	}
	}
	}

And edited the link to :

<a href="javascript:ajaxpage('woodcutting.php', 'content'); javascript:loadobjs('woodcutting.js');">Chop Wood</a>

Sign In

[SOLVED] Dynamically Include PHP File - JS Question

Recommended Posts

Ryuujin

Link to comment

Share on other sites

Xurion

Link to comment

Share on other sites

Ryuujin

Link to comment

Share on other sites

Psycho

Link to comment

Share on other sites

Ryuujin

Link to comment

Share on other sites

Ryuujin

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information