FusionCharts PHP与Ajax

时间:2013-04-09 07:16:30

标签: php ajax fusioncharts

我目前正在使用FusionCharts Free来填充某些图表。

在main.php中:

<html>
<head>
    <script language="JavaScript" src="FusionCharts/FusionCharts.js" ></script>

    <script language="JavaScript">
        function ajax(divID)
        {
            if (window.XMLHttpRequest)
                xmlhttp=new XMLHttpRequest();
            else
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    document.getElementById(divID).innerHTML=xmlhttp.responseText;
            }

            return xmlhttp;
        }

        function detailedChart(couID)
        {
            xmlhttp = ajax("detailedDiv");
            xmlhttp.open("GET", "getDetailedResult.php?couID=" + couID, true);
            xmlhttp.send(null); 
        }       
    </script>
</head>

<body>
    <?php
        $strDataURL = "GetResult.php";
        echo renderChart("FusionCharts/FCF_Column3D.swf", $strDataURL, "", "Chart1", 600, 300);
    ?>

    <div id="detailedDiv" align="center"></div>

</body>
</html>

在GetResult.php中:

if ($result)    
    $chart -> addDataFromDatabase($result, "TOTAL", "NAME", "", "JavaScript:detailedChart('##ID##')");

在GetDetailedResult.php

<?php
    $chart -> newFusionCharts("Column3D", "900", "500");
    $chart -> setSWFPath("FusionCharts/");
    $chart -> setChartParams("caption=....");
    $chart -> addDataFromDatabase($result, "TOTAL", "NAME");
    $chart -> renderChart();
?>

现在的问题是我想使用ajax从GetResult到GetDetailedResult创建向下钻取,但它会显示“Chart”。而不是图表。如果我改变了

  

$ chart - &gt; renderChart();到$ chart - &gt; renderChart(真);

它会告诉我bgcolor =“”。

为什么会发生这种情况,我该如何解决?有没有其他更简单的方法通过ajax填充detailedChart?

百万感谢。

1 个答案:

答案 0 :(得分:0)

如果您进行调查,您会看到HTML DIVSCRIPTDIV中的某些JavaScript代码在responseText中呈现图表){ {1}}。

现在,当您将responseText设置为HTML元素的innerHTML时,HTML DOM解析器会添加并显示HTML部分(带有文本chart的DIV)。但是,它不会执行SCRIPT部分(旨在将DIV内的图表替换为chart文本。

实现渲染的理想方法是执行SCRIPT

如果您使用jQuery ajax函数,则管理得当,类似于:

    function detailedChart(couID) {
        jQuery.ajax({
           url: "getDetailedResult.php?couID=" + couID,
           success: function(responseText) {
              jQuery("#detailedDiv").html(responseText);
           }
      });

    }  

注意:您需要在HTML的头部加载jquery js文件。