私が使用しているグラフはJavaScriptで記述されているため、mysqlクエリ配列をJavaScriptに転送して、グラフを作成する必要があります。mysqlクエリは、ドロップダウンメニューによって生成されます。Webページには、クリックするとグラフを表示するボタンがあります。すべて同じページに表示する必要があります。
それぞれにランナーの名前が記載された2つのドロップダウンメニューがあります。onChangeを介して、各ドロップダウンメニューは同じJavaScript関数を呼び出します-
home.php
<form id='awayPick'>
<select name='awayRunner' id='awayRunner' onchange='Javascript: getitdone(this);/>
...multiple options
</form>
<form id='homePick'>
<select name='homeRunner' id='homeRunner' onchange='Javascript: getitdone(this);/>
...multiple options
</form>
Js.js
function getitdone(str)
{
if (str=="")
{
document.getElementById("midSpa").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp11=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp11=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp11.onreadystatechange=function()
{
if (xmlhttp11.readyState==4 && xmlhttp11.status==200)
{
document.getElementById("midSpa").innerHTML=xmlhttp11.responseText;
}
}
var awayRunner = document.getElementById('awayRunner').value;
var homeRunner = document.getElementById('homeRunner').value;
var queryString = "?awayRunner=" + awayRunner + "&homeRunner=" + homeRunner;
xmlhttp11.open("GET","getRunners.php" + queryString,true);
xmlhttp11.send(null);
}
getRunners.php
$home=$_GET['homeRunner'];
$away=$_GET['awayRunner'];
$db = db;
$homeRunner=array();
$awayRunner = array();
$leagueRunner = array();
$getHome="select ... from $db where ... = '$home'";
$result2 = mysql_query($getHome);
while($row = mysql_fetch_array($result2)){
$homeRunner[]= $row['...'];
}
$getAway="select ... from $db where ... ='$away'";
$result22 = mysql_query($getAway);
while($row2 = mysql_fetch_array($result22)){
$awayRunner[]= $row2['...'];
}
$week = 0;
while($week<20){
$week++;
$getLeague = "select ... from $db where ... = $week";
$resultLeague = mysql_query($getLeague);
while($row3 = mysql_fetch_array($resultLeague)){
$leagueRunner[]=$row3['...'];
}
}
home.php
<script type="text/javascript">
function chartOne(){
$(document).ready(function() {
var chart = new Highcharts.Chart({
chart: {
renderTo:'container',
zoomType:'xy' },
title: {
text:
'title'
},
xAxis: {
categories: [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19]
},
yAxis: [{ // Primary yAxis
labels: {
formatter: function() {
return this.value + 'pts'
},
style: {
color: '#89A54E'
}
},
title: {
text: 'text',
style: {
color: '#89A54E'
}
}
}, { // Secondary yAxis
title: {
text:null,
},
}],
tooltip: {
formatter: function() {
return '' +
this.y +
(this.series.name == ' ' ? ' mm' : 'pts');
}
},
legend: {
layout: 'horizontal',
backgroundColor: '#FFFFFF',
align: 'left',
verticalAlign: 'top',
x: 69,
y: 20,
floating: true,
shadow: true,
},
plotOptions: {
column: {
pointPadding: 0.2,
borderWidth: 0
}
},
series: [ {
name:'adfg',
data: [ <?php echo join($awayRunner, ',');?>],
type: 'column',
pointStart: 0
//pointInterval
},
{
name:'fghtrht',
data: [<?php echo join($homeRunner, ',');?>],
type: 'column',
pointStart: 0
//pointInterval
},
{
name: 'League Avg',
data: [ <?php echo join($leagueRunner, ',');?>],
type:'spline',
pointStart: 0
//pointInterval
},
]
});
});
}
</script>
<input type='submit' value='chart One' onclick='chartOne()'></input>
<div id='container' style='width: 50%; height: 200px; float: left;'></div>
php配列をホームページに戻してjavascriptに戻すにはどうすればよいですか？JavaScriptを別の場所に配置する必要がありますか？
問題は、ランナーの名前を渡そうとしなかったときに、これらすべてを別々のページで実行するようにしたことです。getRunners.phpページでランナー名を明示的に指定すると、すべてがうまく機能します。グラフを生成するためにJavaScriptに挿入するphp変数を取得できません。
getRunners.phpページのphp変数にjsコードを割り当ててから、動作しなかったhome.phpページの変数をエコーしようとしました。
ホームページが読み込まれると、JSは同じままになるようです。ドロップダウンオプションを選択した後でPHP変数を渡して、ボタンがクリックされた後にのみグラフを表示できるようにするにはどうすればよいですか？
ありがとうございました。これが私の前の質問よりも明確であることを願っています。