Loading javascript into DIV

harleyhar · October 3, 2011

Hi,

I need some help on getting my javascript to display in a div after making an AJAX call.

The javascript is created and written to a file. I have tested the javascript by creating a static html page with it that shows the result that I am looking for. However when I try to populate it with AJAX the only thing that shows up is a line of text that I placed outside of the <script></script> tags.

Here is the function draw_chart that calls the php program;

<head>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>

<script type="text/javascript">
google.load('visualization', '1', {packages: ['corechart']});

function getXMLHTTP() {
	var xmlhttp=false;	
	try{
		xmlhttp=new XMLHttpRequest();
	}
	catch(e)	{		
		try{			
			xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
		}
		catch(e){
			try{
			xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
			}
			catch(e1){
				xmlhttp=false;
				alert("Fail");
			}
		}
	}

	return xmlhttp;
}
function drawChart(id) { // update the visualization div with valid chart data 

var req = getXMLHTTP(); // fuction to get xmlhttp object
if (req) {
	req.onreadystatechange = function() {
		if (req.readyState == 4) { //data is retrieved from server
			if (req.status == 200) { // which reprents ok status                    
				document.getElementById('visualization').innerHTML=req.responseText;
			}
			else
			{ 
				alert("There was a problem while using XMLHTTP:\n");
			}
		}            
	}

	req.open("GET", "draw_chart.php?id="+id, true); //open url using get method
	req.send(null);
}
}
</script>

</HEAD>

Here is the draw_chart.php file. The code that is being read from the data file was tested in the Google Code Playground and works.

<?php 
// First read the chart info from the data file
if (isset($_GET['id'])) {

	$ch = curl_init("data/" . $_GET['$id']) ;
	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
	$contents = curl_exec ($ch);
	curl_close ($ch);

	$fp = fopen("data/".$_GET['id'], "r");

	while (!feof ($fp)) {
		$line = fgets ($fp, 4096);
		echo $line;
	}

	fclose($fp);

	echo "Script output finished";
}


?>

"Script output finished" is what ends up displayed in the div. I've tried running it with with the <script> tags removed from the input file and I can see all the code gets written.

Here is my html part;

<div id='visualization'></div>

<script type='text/javascript'>
    drawChart(7640);
</script>

Any help at all about what I might be able to try to find out what's going on will be greatly appreciated. I've run out of ideas.

Thanks!

Sign In

Loading javascript into DIV

Recommended Posts

harleyhar

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information