Question

I have a php file that returns a div and a javascript.
I want to change a specific div (actually its contents) so the code for Ajax is the following

<script type="text/javascript">
function changemainpage(id) {


  if (window.XMLHttpRequest)
   { //code for IE7+. Ffirefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
   }  
   else { //code for IE6,IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }


   xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4)
    { 
        HandleResponse(xmlhttp.responseText);
    }
   }

   xmlhttp.open("GET","./newgraph.php?id=unit"+id,true);
   xmlhttp.send(null);

}

function HandleResponse (response) {

    document.getElementById('content').innerHTML=response;
    document.getElementById('content').src=document.getElementById('content').src;
}


function ChangeMainContent(id, graph){
    $('#content').load('newgraph/index.php?id=' + id,'&graph='+graph);
}

</script>

Now the problem lies that when the content is changed it is not parsed as a javascript. Here is php code in newgraph.php

<?php 
echo "<!--dygraphs are not happy when placed inside a <center> tag. If you want to center a Dygraph, put it inside a table a table with align=center set. For more options go to dygraphs.com/options-->\n
<div id=\"graphid\" onLoad='refresh()' style=\"width:320px; height:290px;\"></div>\n";

?>
<?php 
//$table="unit1";
$table=$_GET['id'];
$ylabel="EnergyReckVARh"; //Available are Error BIT(1), UTCOffsetMin SMALLINT, LocalDatetime DATETIME, EnergyDeliveredkWh INT, EnergyReceivedkWh INT, EnergyDelkVARh INT, EnergyReckVARh INT, ApparentPowerTotalkVA SMALLINT, RealPowerTotalkW SMALLINT, ReactivePowerTotalkVAR SMALLINT
$outfile='outfile.csv';

echo $table;
//delete file in case it exists
//unlink($outfile);

//show database table
    include './database/config.php';
    include './database/opendb.php';

    $csv_output.='LocalDatetime,';
    $csv_output.=$ylabel;
    $csv_output.="\n";

    $result=mysql_query("SELECT LocalDatetime,".$ylabel." FROM ".$table." ORDER BY LocalDatetime");
    $dbcols = mysql_num_fields($result);
    $dbrows = mysql_num_rows($result);
    while ($row=mysql_fetch_row($result)){
        for ($i=0;$i<$dbcols;$i++){
            $csv_output.=$row[$i].",";
        }
        $csv_output=substr_replace($csv_output,"",-1);  //remove that last ","
        $csv_output.="\n";
    };

    $handle=fopen($outfile, 'w') or die ("Can;t open file");
    fwrite($handle, $csv_output);
    fclose($handle);

    //close database
    include './database/closedb.php';

echo "<script type=\"text/javascript\">
    var datamatrix=[];\n";


    //\"2008-05-07 18:00:00,75\\n\" +
    //\"2008-05-07 18:05:00,90\\n\" +
    //\"2008-05-07 18:06:00,80\\n\",
echo    "var ylabel='".$ylabel."';
    var tablet='".$table."';";


 echo "  
   var opts =     {
    title: ylabel+' for '+tablet,   
    ylabel: ylabel,     
    //showRangeSelector: true,
    legend: 'always',
    //rollPeriod: 50,
    showRoller: true,
    rangeSelectorPlotFillColor: '#A7B1C4',
    rangeSelectorPlotStrokeColor: 'red',
    fillGraph: true,
    //rangeSelectorHeight: '30'

    };

    alert(\"New Javascript is running\");
    g = new Dygraph(

    // containing div
    document.getElementById(\"graphid\"),
    // CSV or path to a CSV file.
    //\"Date,$ylabel\\n\" +\".\"\n
    \"$outfile\",
    //\"outfile.csv\",
    opts
    );
";

echo "</script>";

echo "dbrows are $dbrows";

?>

The php file returns the code but it is not parsed as a javascript, i.e. the alert does not pop up a new window! If I run it from the start everything works great. I though the

    document.getElementById('content').src=document.getElementById('content').src;

would do the trick but this is not the case. Any help much appreciated.

Answer 1

I have no idea why you are creating your own Xml Request as you are already using jQuery.

Just throw your complete JS code away and do this:

function changemainpage(id) {
    $('#content').load('./newgraph.php?id=unit'+id);
}

And jQuery will execute the JS code included in the incoming page as well.