0

データベースから JSON オブジェクト クエリを表示しようとしていますが、受け取った JSON オブジェクトは正しいようです。

{
    "cols": [
        {
            "id": "A",
            "label": "Date",
            "type": "string"
        },
        {
            "id": "B",
            "label": "User",
            "type": "string"
        },
        {
            "id": "C",
            "label": "Cement Brand",
            "type": "string"
        },
        {
            "id": "D",
            "label": "Volume",
            "type": "string"
        },
        {
            "id": "E",
            "label": "Type",
            "type": "string"
        }
    ],
    "rows": [
        {
            "c": [
                {
                    "v": "08-06-2013"
                },
                {
                    "v": "razee.hj@gmail.com"
                },
                {
                    "v": "Muthana"
                },
                {
                    "v": "27"
                },
                {
                    "v": "Local Plant"
                }
            ]
        }
    ]
}

しかし、データを照会するphpファイルに問題があるようですが、間違いを見つけることができません。これは dataTableViewDaily.php ファイルです

  <?php

    $selectQuery = 'SELECT * FROM competitive_daily_volume';

    $table = array();
    $table['cols'] = array(
        array("id"=>"A","label"=>"Date","type"=>"string"),
        array("id"=>"B","label"=>"User","type"=>"string"),
        array("id"=>"C","label"=>"Cement Brand","type"=>"string"),
        array("id"=>"D","label"=>"Volume","type"=>"string"),
        array("id"=>"E","label"=>"Type","type"=>"string")
    );


    $rows = array();
    $result = mysql_query($selectQuery);
        while($row = mysql_fetch_assoc($result)){
            $temp =  array();
            $temp[] = array("v"=> $row['Date']);
            $temp[] = array("v"=> $row['UserId']);
            $temp[] = array("v"=> $row['CementBrand']);
            $temp[] = array("v"=> $row['VolumeBGLP']);
            $temp[] = array("v"=> $row['Type']);

            $rows[] = array("c"=> $temp);

        }

    $table['rows'] = $rows;
    $jsonObj = json_encode($table);

    header('Cache-Control: no-cache, must-revalidate');
    header('Content-type: application/json');

    echo $jsonObj;

    ?>

そして、これはJavaScriptファイルです：

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">
      google.load('visualization', '1', {packages: ['table']});
    </script>
    <script type="text/javascript">
    function drawVisualization() {
       // var jsonData = null;
        var jsonData = $.ajax({
          url: "php/DailyVolume/dataTableViewDaily.php", // make this url point to the data file
          dataType: "json",
          async: false
        }).responseText;

    var data = new google.visualization.DataTable(jsonData); 
      // Create and draw the visualization.
      visualization = new google.visualization.Table(document.getElementById('table'));
      visualization.draw(data, null);

    }


    google.setOnLoadCallback(drawVisualization);
    </script>
  </head>
  <body style="font-family: Arial;border: 0 none;">
    <div id="table"></div>
  </body>
</html>

私はこれに長い間静かに取り組んできましたが、欠けているものを見つけることができません。コメントをいただければ幸いです。

4

2 に答える 2

0

問題はこれです：

var jsonData = $.ajax({
          url: "php/DailyVolume/dataTableViewDaily.php", // make this url point to the data file
          dataType: "json",
          async: false
        }).responseText;

次のように変更します。

 var jsonData;
 $.ajax({
              url: "php/DailyVolume/dataTableViewDaily.php", // make this url point to the data file
              dataType: "json",
              async: false,
              success:function(data){
                   //get data in your callback
                  jsonData = data;
              }
            });

または、推奨されるアプローチを使用しpromiseて回避しasync: falseます。

$.ajax({
           url: "php/DailyVolume/dataTableViewDaily.php", // make this url point to the data file
           dataType: "json",
}).done(function(jsonData){
      var data = new google.visualization.DataTable(jsonData); 
      // Create and draw the visualization.
      visualization = new google.visualization.Table(document.getElementById('table'));
      visualization.draw(data, null);
});
于 2013-08-16T13:24:32.470 に答える
0

これを変更する必要があります

var jsonData = $.ajax({
      url: "php/DailyVolume/dataTableViewDaily.php", // make this url point to the data file
      dataType: "json",
      async: false
    }).responseText;

var data = new google.visualization.DataTable(jsonData);

これに

$.ajax({
      url: "php/DailyVolume/dataTableViewDaily.php", // make this url point to the data file
      dataType: "json",
      async: false,
      success : function(response){
          var data = new google.visualization.DataTable(response);
          // other code
      }
    });
于 2013-08-16T13:26:50.027 に答える