Jump to content

[SOLVED] Dynamically Include PHP File - JS Question


Ryuujin

Recommended Posts

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

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'

 

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 :(

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>

Archived

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

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.