0

MySQLクエリによって駆動されるjChartFXチャートがいくつかあるページを持つWebサイトを構築しようとしています。クエリは、メイン ページのドロップダウンで選択された日付によって駆動されます。

別のオプションが選択されたときにグラフが更新されるように、コードを適切に構成するのに苦労しています (すべて完全に独学なので、練習不足です!)。

コードは以下にリストされていますが、私の質問は次のとおりです。これを機能させるには、チャートを描画するコードをどこに配置する必要がありますか。関数 loadChart がメイン ページに存在し、別のページのクエリからデータをエコーする必要がありますか、または jquery またはオプション 3 によって読み込まれる別のページに関数全体を配置する必要がありますか?マーク？

チャートのコードは次のとおりです。<> echo $data は、MySQL の出力をエコーするセクションで、コードと SQL クエリが修正されると正常に動作します。

<script>
    var chart1;
    function loadChart()
      {        
           chart1 = new cfx.Chart();
            chart1.getData().setSeries(1);
                chart1.getAxisY().setMin(100);
                chart1.getAxisY().setMax(1000);
                var series1 = chart1.getSeries().getItem(0);                     series1.setGallery(cfx.Gallery.Lines);

            var data = <?php echo json_encode($temp, JSON_NUMERIC_CHECK); ?>;
                chart1.setDataSource(data);
                var divHolder = document.getElementById('ChartDiv');
            chart1.create(divHolder);            
         }
</script>

SQLクエリは

SELECT COUNT(`column_Date`) AS 'Count' FROM Dates WHERE `column_Date` > date('2013-06-01')

注: 日付が 2013 年 6 月 1 日より上にある場合、メイン ページのドロップダウンに基づいてこれを変更したいと考えています。

    <head>
    <script src="js/jquery-1.7.1.min.js"></script> 
    <script>
        $(document).ready(function(){
            $("#optionschosenid").click(function(){
                if($("#optionsid").val() == "OptionA" ){
                    $("#chart").load("weeks.php");
                }
                else {
                    $("#chart").load("text_test.php");
                }

            });
        });
 </script>
</head>
<body onload="loadChart()">
<div id="row">
    <form method="post" id="weekcommencing" name="dateselector">
        <select id="optionsid" name="optionsname">
            <option value="2013-06-01">June</option>
            <option value="2013-01-01">January</option>
        </select>
        <button name="optionschosenname" id="optionschosenid"> Select Additional Option </button>
    </form>
</div> 
    <div id="chart" name="chart">
    <?php echo $data;
        echo 'hello'; ?>    
    <br /> -->
    Test 0.11
   </div>
   <button id="testId">click me</button>

   <br />
   <br />
   <div id="ChartDiv">

   </div>
   </body>
4

1 に答える 1

1

あなたの質問への答えはおそらく「オプション3」です-あなたは完全に的外れです:)

PHP の $data 変数の内容がわかりません。変数が宣言および設定された場所が表示されません。data という名前の Javascript 変数が表示されます。JavaScript の変数と PHP の変数がお互いに見えるような印象を持っているのではないでしょうか? 彼らは間違いなくそうではありません。

肝心なのは、すべてを可能な限り分離する必要があるということです-それはあなたが始めているようです. JS ファイルから JavaScript をインクルードします。テンプレートから HTML を含めます。

あなたは初心者ですが、MVC フレームワークに飛び込む必要があるほど十分に噛み付いています。少なくともいくつかの優れたプラクティスを学ぶ必要があります。

于 2014-07-16T22:32:54.497 に答える