需要根据xampp服务器中的下拉菜单更新图表

时间:2018-01-10 13:14:04

标签: php mysql drop-down-menu xampp google-visualization

我有一张名为' Marks'在Mysql数据库(practice_database)中,包含以下值:(我使用的是xampp服务器) 名称,Sem,内部,End_Sem, 阿瓦尼1 55 56 Alka 1 26 29 Saurabh 1 44 40 Rekha 1 42 39 拉尔夫1 52 60 阿瓦尼2 57 51 Alka 2 53 52 Saurabh 2 33 22 Rekha 2 37 29 拉尔夫2 47 55 阿瓦尼3 56 59 Alka 3 47 45 Saurabh 3 33 45 Rekha 3 32 25 拉尔夫3 44 59

我需要创建一个图表,其中将显示内部和end_sem标记,具体取决于我在相应的下拉菜单中选择的值。下拉菜单必须由Sem列填充。 这是以下代码:

<?php
 $con = mysqli_connect('localhost','root','','practice_database');
?>
<!DOCTYPE HTML>
<html>
<head>
 <meta charset="utf-8">
<body>
<form name="frmdropdown" method="POST" >
     <center>
            <h2 align="right">SEMESTER</h2>

            <strong> Select Semester: </strong> 
            <select align="right" name="empName"> 
               <option value=""> -----ALL----- </option> 
            <?php
                 $Sem="Select DISTINCT Sem from Marks";
                 $exec1 = mysqli_query($con,$Sem);
                 while($r=mysqli_fetch_array($exec1)) {

                  echo "<option value='$r[0]'> $r[0] </option>";
                 }
             ?>
            </select>

</body>
 <title>
 Create Google Charts
 </title>
 <script type="text/javascript" src="https://www.google.com/jsapi"></script>
 <script type="text/javascript">
 google.load("visualization", "1", {packages:["corechart"]});
 google.setOnLoadCallback(drawChart);

function drawChart() {
 var data = google.visualization.arrayToDataTable([

 ['Name', 'Internal', 'End_sem'],

<?php 
   if($_SERVER['REQUEST_METHOD'] == "POST")
   {
         $des=$_POST["empName"]; 
         if($des=="")  // if ALL is selected in Dropdown box
         { 
             $query="SELECT Name, Internal, End_sem FROM Marks";
         }
         else
         { 
             $query="SELECT Name, Internal, End_sem FROM Marks where sem='".$des."'";
         }
    }
    while($row = mysqli_fetch_row($query)) {
 echo "['".$row['Name']."',".$row['Internal'].",".$row['End_sem']."],";
 }
 ?>

 ]);

 var options = {
      title: 'Student Performance',titleTextStyle: {color: 'black'},
      hAxis: {title: 'Student Name-->', titleTextStyle: {color: 'red'}},
      vAxis: {title: 'Marks', titleTextStyle: {color: 'green'}},
      colors: ['blue','red'],
      is3D:true
};
 var chart = new google.visualization.ColumnChart(document.getElementById("columnchart"));
 chart.draw(data, options);
} 
 </script>
</head>
<body>
 <h3>Column Chart</h3>
 <div id="columnchart" style="width: 900px; height: 500px; color: red;"></div>
</body>
</html>

然而,它不起作用。没有下拉菜单部分,代码工作正常。但是我的经理希望下拉菜单包括强制性。由于我之前没有编程经验,我发现谷歌图表更容易。有人可以请纠正这个特定代码中的错误吗?将不胜感激。感谢。

1 个答案:

答案 0 :(得分:0)

问题是您不提交查询。您正在尝试对字符串而不是mysqli_result执行mysqli_fetch_row。是否要在初始页面加载时加载所有行?然后,您还需要将查询放在REQUEST_METHOD的检查之外。这样做:

if($_SERVER['REQUEST_METHOD'] == "POST" && $_POST["empName"])
{
     $query="SELECT Name, Internal, End_sem FROM Marks where sem='".$_POST["empName"]."'";
} 
else
{ 
     $query="SELECT Name, Internal, End_sem FROM Marks";
}

$result = mysqli_query($con, $query);

while($row = mysqli_fetch_row($result)) {
    echo "['".$row['Name']."',".$row['Internal'].",".$row['End_sem']."],";
}

关于代码的一些注意事项:您应该使用mysqli的面向对象样式而不是程序mysqli_函数,尤其是出于安全原因。您需要清理$_POST["empName"]和您的查询以防止mysql注入。你应该读这个:How can I prevent SQL injection in PHP?

您是否考虑过使用JavaScript而不是重新加载页面来按学期进行过滤?无论如何,当您在init上加载完整数据时,这可以很容易地实现。您可以将数据存储在drawChart()方法之外的全局变量中,并为select定义onchange回调方法,该方法会过滤行并重新绘制图表。