Question

请帮助...... 我想在file_1中显示Highchart，当高级脚本在file_2上时... 我正在使用PHP，Jquery和AJAX ...... 这是脚本

SCR_test02.php

<?php 

require "function.inc.php";
//require "showscr.php";

include "conn.php";
include "q_table.php";

?> 

<form name="scr_form">
<table border="1" align="center" width="80%">
<tr>
  <td align="center">
   <input type="button" onClick="SCRajaxFunction()" value="Submit" id="sub">
  </td>
  <td>
   <input type="reset">
  </td> 
 </tr>  
<tr>
    <td colspan="6">&nbsp;
    <div id="scr"></div>
    </td>

</tr>


</table>

</form>
<script src="../Highcharts-3.0.5/js/highcharts.js"></script>


</html>

function.inc

var htmlobjek; 
$(document).ready(function()
{ 

  $("#region").change(function()
  {
    var region = $("#region").val(); 
    $.ajax(
    { 
        url: "GetMSC.php", 
        data: "region="+region, 
        cache: false, 
        success: function(msg)
        {   
            $("#msc").val(msg); 
        } 
    }); 
  }); 
}); 



//Ketika form di submit
function SCRajaxFunction(){
    var ajaxRequest;  // The variable that makes Ajax possible!

    try{
        // Opera 8.0+, Firefox, Safari
        ajaxRequest = new XMLHttpRequest();
    } catch (e){
        // Internet Explorer Browsers
        try{
            ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try{
                ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e){
                // Something went wrong
                alert("Your browser broke!");
                return false;
            }
        }
    }
    // Create a function that will receive data sent from the server
    ajaxRequest.onreadystatechange = function()
    {
        if(ajaxRequest.readyState == 4)
        {
            var ajaxDisplay = document.getElementById('scr');
            ajaxDisplay.innerHTML = ajaxRequest.responseText;
        }
    }
    var period = document.getElementById('period').value;
    var datefrom = document.getElementById('datefrom').value;
    var dateto = document.getElementById('dateto').value;
    var region = document.getElementById('region').value;
    var msc = document.getElementById('msc').value;
    //var rows = document.getElementById('rows').value;
    var dataString = "?datefrom=" + datefrom + "&dateto=" + dateto + "&region=" + region + "&msc=" + msc + "&period=" + period;// + "&rows=" + rows;
    ajaxRequest.open("GET", "ShowSCR.php" + dataString, true);
    ajaxRequest.send(null); 
}

ShowSCR

<html>  

<?
require "function.inc.php";
    //require "highchart_tes.php";
    include "conn.php";

    $period = $_GET['period']; 
    $datefrom = $_GET['datefrom']; 
    $dateto = $_GET['dateto'];
    $region = $_GET['region'];
    $msc = $_GET['msc'];

        $drop=array(); 
        $drop2=array();     
        $traffic=array();
        $data1=array(); 
        $data2=array();
        $sql = "SELECT distinct Date_id, hour_id 
            FROM scrkpi_h
            WHERE Date_id >= '2012-12-01' 
            AND Date_id <= '2012-12-03'
            AND MSC like 'MSBDL%'
            ORDER BY Date_id ASC ";  
        $qry = mysql_query($sql,$koneksi) or die ("Gagal Query - ".mysql_error());  
        while ($data=mysql_fetch_array($qry))
        {  


            $a = date('Y-m-d ', strtotime($data['Date_id']));
            $data1[] = $a. $data[1];

        }  


?>  
    <script type="text/javascript" src="../Highcharts-3.0.5/js/type/jquery-1.7.1.min.js"></script>
    <script src="../Highcharts-3.0.5/js/highcharts.js"></script>


<script type="text/javascript">


    var chart1;
    $(document).ready(function() 
    {
            chart1 = new Highcharts.Chart(
            {
                chart: {
                renderTo: 'scr_core'
                },
                title: {
                    text: 'SCR Core ',
                    x: -20 //center
                },
                subtitle: {
                    text: '',
                    x: -20
                },
                xAxis: 
                {
                    categories: ['<?php echo join($data1, "','") ?>'],
                    //['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']

                    labels: 
                    {
                        rotation: -90
                    }   
                },
                yAxis: {
                    title: {
                        text: '%'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                tooltip: {
                    formatter: function() {
                            return '<b>'+ this.series.name +'</b><br/>'+
                            this.x +': '+ this.y +' % (percentage)';
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'middle',
                    borderWidth: 0
                },
                series: 
                [
                <?php //query tiap msc lbih dulu, baru tiap msc diambil datanya, dijadikan data berjajar berdasar koma
                $sql   = "SELECT distinct msc_id, MSC 
                        FROM `scrkpi_h` 
                        WHERE MSC like 'MSBDL%'"; //buat data di legend
                $query = mysql_query( $sql );
                while( $ret = mysql_fetch_array( $query ) ){
                   $nId = $ret[0]; //query dari scrkpi_h, msc_id = array 0
                   $nodes = $ret[1];
                      $sql_   = "SELECT * FROM `scrkpi_h` 
                      WHERE `msc_id`='$nId' 
                      AND Date_id >= '2012-12-01' 
                      AND Date_id <= '2012-12-03'
                      AND MSC like 'MSBDL%'
                      ORDER BY Date_id ASC ";
                      $query_ = mysql_query( $sql_ );

                      $data = "";
                      while( $ret_ = mysql_fetch_array( $query_ ) ){
                         $kel = $ret_['scrCombine'];
                         $data = $data . "," . $kel;
                      }
                      $data = substr( $data , 1 , strlen( $data ) );
                ?>
                {
                    name: '<?php echo $nodes; ?>',
                    data: [<?php echo $data; ?>]
                      },
                <?php


                }
                ?>
                ]
            });
        });

</script>

<div id='scr_core' style='min-width: 10px; height: 10px; margin: 0'></div>
</html>

图表已经显示在ShowSCR.php文件中但是我想把它显示在文件SCR_test02.php上div =＆＃34; scr＆＃34;当我点击＆＃34;提交＆＃34;按键如何解决这个问题，我已多次尝试但没有工作，真的需要帮助

Answer 1

它不起作用，因为在你的例子SCR_test02.php中你有行

`require "function.inc.php";
//require "showscr.php";

include "conn.php";
include "q_table.php";`

但是在这个文件中你没有图表初始化，只调用ajax，那就是全部。您需要在php中添加javascript highcharts调用或准备扩展，这将是SCR_test02.php和ShowSCR的常用文件，由reguire declatarion包含。

编辑：的common.php

<script src="path/to/highcharts.js"></script>
<script>
  //highcharts initialization
</script>

然后在每个文件中使用

require "common.php"

在其他文件中提交表单后显示高图

1 个答案: