我正在尋找建立一個網站,其中有一個頁面,其中有一些jQuery圖表,這是由MySQL查詢驅動的。該查詢由在主頁上的下拉列表中選擇的日期驅動。Jquery和SQL的組合
我正在努力構建正確的代碼(所有完全自學都充滿了糟糕的練習!),以便在選擇不同選項時更新圖表。
代碼列在下面,但我的問題是;代碼應該在哪裏繪製圖表來完成這項工作。如果主頁面上存在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>
延遲道歉。你會特別推薦任何MVC框架嗎?我也錯過了在JSON_Encode($ data)中從SQL查詢中回顯$ data變量的代碼行。你可能會建議哪些社區可以上傳整個文件供人們協助?我對stackoverflow非常滿意,但無法共享是有點限制。 – Maudise