PHPチャートのJSロードMySQLとのインタフェース

Question

これは私の源であるViewGraph.php

 <?php 
      $datesGraph = array(); 
      $Moneyss = array(); 
      $SQL = "select right(DateTransaksi,2) as Dates, SUM(AllMoney) as Money from view_resume_transaksi 
        where DateTransaksi between '20160401' and '20160420' group by DateTransaksi order by DateTransaksi asc" ; 

      $hasil=sqlsrv_query($conn, $SQL) or die($SQL . "<br>" .print_r(sqlsrv_errors(), true)) ; 
       while($row = sqlsrv_fetch_array($hasil)){ 
             $Moneyss[$row[0]] = (int)$row[1]; 
             $datesGraph[]=$row['tgl']; 
             $Moneyss[]=$row['Money']; 

            } 

?> 

<script> 
    var randomScalingFactor = function(){ return Math.round(Math.random()*100)}; 
    var lineChartData = { 
     labels : <?=json_encode($datesGraph);?>, 
     datasets : [ 
      { 
       label: "My Second dataset", 
       fillColor : "rgba(151,187,205,0.2)", 
       strokeColor : "rgba(151,187,205,1)", 
       pointColor : "rgba(151,187,205,1)", 
       pointStrokeColor : "#fff", 
       pointHighlightFill : "#fff", 
       pointHighlightStroke : "rgba(151,187,205,1)", 
      data : <?=json_encode($Moneyss);?> 
      } 
     ] 
    } 
    window.onload = function(){ 
    showGrafik(); 
} 

function showGrafik(){ 
    var ctx = document.getElementById("canvas").getContext("2d"); 
     window.myLine = new Chart(ctx).Line(lineChartData, { 
      responsive: true 
     }); 
} 

と私はこれは、MySQLから正常にロードデータである下

<td> <label align="left">Choose Date</label> <input type='text' id='date1_g' name='date1_g' size='12' value="<?php echo date('d-m-Y');?> ">until <input type='text' id='date2_g' name='date2_g' size='12' value="<?php echo date('d-m-Y');?> "> </td> 

<div style="width:80%"><canvas id="canvas" height="450" width="600"></canvas> 
</div> 

でこれを持っている... が、私は知らない、 ユーザーが日付を変更し、mysqlとビューのグラフから日付を取得する場合。 私はこのようなprosesが>日付を選択 - > ajaxを使用してデータを送信する>グラフを表示することを意味します。 は、このようにprosesをロード> .php - >グラフを表示します（sqlはインタフェースからパラメータを取得しないため）。

私は助けてください、私はグラフをajaxを使って表示したいと思います...ありがとうございます。

Answer 1

dateFromとdateToを引数として受け入れるjavascriptで、phpでajax経由でsqlクエリを呼び出す関数を作成します。 このようなもの..

var path_to_php_file = 'getdate.php'; 
    function loadchartbydate(dateFrom,dateTo){ 
    $.ajax(){ 
     url: path_to_php_file, 
     type: 'POST', 
     dataType: 'json', 
     data: {'dateFrom': dateFrom, 'dateTo': dateTo}, 
     success: function(data){ 
     //display data in chart 
     //add under success callback function 
     var randomScalingFactor = function(){ return        Math.round(Math.random()*100)}; 
     var lineChartData = { 
     labels : <?=json_encode($datesGraph);?>, 
      datasets : [ 
       { 
       label: "My Second dataset", 
       fillColor : "rgba(151,187,205,0.2)", 
       strokeColor : "rgba(151,187,205,1)", 
       pointColor : "rgba(151,187,205,1)", 
       pointStrokeColor : "#fff", 
       pointHighlightFill : "#fff", 
       pointHighlightStroke : "rgba(151,187,205,1)", 
        data : <?=json_encode($Moneyss);?> 
       } 
      ] 
      } 
     window.onload = function(){ 
       var ctx = document.getElementById("canvas").getContext("2d"); 
       window.myLine = new Chart(ctx).Line(lineChartData, { 
          responsive: true 
       }); 
     } 

     }, 
     error: function(err){ 
     console.log(err.responseText); 
     } 
    } 
}