Question

我希望建立一个有一个页面的网站，其中有一些jChartFX图表，由MySQL查询驱动。查询由在主页上的下拉列表中选择的日期驱动。

我正在努力正确地构建代码（所有这些都是完全自学的，所以充满了糟糕的练习！）以便在选择其他选项时图表会更新。

下面列出了代码，但我的问题是;代码应该放在哪里绘制图表以使其工作。如果函数loadChart存在于主页面上并且从另一个页面中查询来自查询的数据，或者我应该将整个函数放在由jquery或选项3加载的单独页面上 - 我是完全广泛的标记

图表的代码是; ＆LT;＆GT; 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-06-01，我希望根据主页的下拉菜单进行更改。

    <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>

Answer 1

您的问题的答案很可能是“选项3” - 您的标记非常广泛：）

我不知道你的PHP $数据变量是什么 - 你没有显示它被声明和设置的位置。我看到一个名为data的Javascsript变量。我想知道你是否会觉得javascript变量和PHP变量彼此可见？他们肯定不是。

底线是你应该尽可能地分开所有东西 - 因为你似乎正在开始做。包括JS文件中的javascript。包含模板中的HTML。

即使你是新手，但你还是要咬得太紧，以至于你应该潜入MVC framework。它会迫使你至少学习一些好的做法。

Jquery和SQL的结合

1 个答案: