Php CodeIgniter和Google图表-基于mysql值的下拉列表

我正在使用CodeIgniter、GoogleCharts和php以及MySQL来显示图表。它使用固定查询工作。我正在尝试添加一个下拉列表，以根据所选选项（sql列“状态”）显示图表 这是我到目前为止所拥有的。我如何修改它以接受下拉列表值

model.php

public function get_chart_data()  
{
    $query = $this->db->get($this->db_mgmt);
    $this->db->select('rating, COUNT(rating) AS Count');
    $this->db->from('db_mgmt');
    $this->db->where('status =', $status);
    $this->db->group_by('rating'); 
    $query = $this->db->get();
    $results['chart'] = $query->result();
}

public function fetch_result($status)  
  {
    $query = $this->db->get($this->db_mgmt);
    $this->db->select('rating, COUNT(status) AS Status_Count');
    $this->db->from('db__mgmt');
    $this->db->where('status =', $status);
    $this->db->group_by('rating'); 
    $query = $this->db->get();
    return $query;
  }

public function fetch_result($status)  
  {
    $query = $this->db->get($this->db_mgmt);
    $this->db->select('rating, COUNT(status) AS status_count');
    $this->db->from('db_mgmt');
    $this->db->where('status =', $status);
    $this->db->group_by('rating'); 
    $query = $this->db->get();

    $results_new = $query->result();  // <-- Forgot to add this!
    return $results_new;
  }

controller.php

$this->load->model('model', 'chart');
public function index() {
        $results = $this->chart->get_chart_data();
        $data['chart'] = $results['chart'];
        $this->load->view('index.php', $data);
}

$this->load->model('model', 'chart');
public function mychart() {

if(!empty($_POST["val"])) {
    $val=$_POST["val"];
    $result_new=$this->chart->fetch_result($val);

    $array = array();
    $cols = array();
    $rows = array();
    $cols[] = array("id"=>"","label"=>" Rating","pattern"=>"","type"=>"string");
    $cols[] = array("id"=>"","label"=>"Count","pattern"=>"","type"=>"number");  

    foreach ($result_new as $object) {
      $rows[] = array("c"=>array(array("v"=>$object->risk_rating,"f"=>null),array("v"=>(int)$object->Status_Count,"f"=>null)));
   }

    $array = array("cols"=>$cols,"rows"=>$rows);
    echo json_encode($array);

    }

}

$this->load->model('model', 'chart');

public function mychart() {

if(!empty($_POST['option'])) {     

$val = $_POST['option'];            
$result_new=$this->chart->fetch_result($val);

$array = array();
$cols = array();
$rows = array();
$cols[] = array("id"=>"","label"=>" Rating","pattern"=>"","type"=>"string");
$cols[] = array("id"=>"","label"=>"Count","pattern"=>"","type"=>"number");  

foreach ($result_new as $object) {
  $rows[] = array("c"=>array(array("v"=>(string)$object->rating),array("v"=>(int)$object->status_count)));
}

$array = array("cols"=>$cols,"rows"=>$rows);
echo json_encode($array);

}
}

view.php

<?php 
foreach ($chart as $object) {
$open_all[] = "['".$object->rating."', ".$object->Count."]";
}
?>

  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart_open);

   function drawChart_open() {
    // Create the data table.
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Rating');
    data.addColumn('number', 'Count');
    data.addRows([
    <?php echo implode(",", $open_all);?>
    ]);

    var options = {
      pieSliceText: 'value-and-percentage',
    };

    var chart = new google.visualization.PieChart(document.getElementById('open_div'));
    chart.draw(data, options);

  }

  <div id="open_div" class="chart"></div>

function drawChart_open_all(num) {         
    var PieChartData = $.ajax({
    type: "POST",
    url: "<?php echo base_url(); ?>" + "dashboard/chart/mychart",
    data:'val='+num,
    dataType:"json"
    }).responseText;

    alert(PieChartData);


    // Create the data table.
    var data = new google.visualization.DataTable(PieChartData);
    var options = {
              pieSliceText: 'value-and-percentage',       
    };

    var chart = new google.visualization.PieChart(document.getElementById('open_new'));
    chart.draw(data, options);

  }

<div><span> <b>Pie Chart<br /><br /></span></div>
<form>
  <select name="status" onchange="drawChart_open_all(this.value)">
<option value="WIP">WIP</option>
<option value="Close">Close</option>
  </select>
</form>
<div id="open_new" class="chart"></div>

   function drawChart_open_all(status) {

    var PieChartData = $.ajax({
    type: 'POST',
    url: "<?php echo base_url(); ?>" + "dashboard/chart/mychart",
    data: { 'option':status },  // <-- kept as option instead of val
    dataType:"json",
    global: false,              // <-- Added 
    async:false,                // <-- Added 
    success: function(data){    // <-- Added 
    return data;                // <-- Added 
    },
    error: function(xhr, textStatus, error){
        console.log(xhr.statusText);
        console.log(textStatus);
        console.log(error);
    }
    }).responseText;

    // Create the data table.
    var data = new google.visualization.DataTable(PieChartData);
    var options = {  pieSliceText: 'value-and-percentage', };

    var chart = new google.visualization.PieChart(document.getElementById('open_new'));
    chart.draw(data, options);
  }

<div><span> <b>Pie Chart<br /><br /></span></div>
<form>
<select name="status" onchange="drawChart_open_all(this.value)">
<option value="WIP">WIP</option>
<option value="Close">Close</option>
</select>
</form>
<div id="open_new" class="chart"></div>

controller.php

$this->load->model('model', 'chart');
public function index() {
        $results = $this->chart->get_chart_data();
        $data['chart'] = $results['chart'];
        $this->load->view('index.php', $data);
}

$this->load->model('model', 'chart');
public function mychart() {

if(!empty($_POST["val"])) {
    $val=$_POST["val"];
    $result_new=$this->chart->fetch_result($val);

    $array = array();
    $cols = array();
    $rows = array();
    $cols[] = array("id"=>"","label"=>" Rating","pattern"=>"","type"=>"string");
    $cols[] = array("id"=>"","label"=>"Count","pattern"=>"","type"=>"number");  

    foreach ($result_new as $object) {
      $rows[] = array("c"=>array(array("v"=>$object->risk_rating,"f"=>null),array("v"=>(int)$object->Status_Count,"f"=>null)));
   }

    $array = array("cols"=>$cols,"rows"=>$rows);
    echo json_encode($array);

    }

}

$this->load->model('model', 'chart');

public function mychart() {

if(!empty($_POST['option'])) {     

$val = $_POST['option'];            
$result_new=$this->chart->fetch_result($val);

$array = array();
$cols = array();
$rows = array();
$cols[] = array("id"=>"","label"=>" Rating","pattern"=>"","type"=>"string");
$cols[] = array("id"=>"","label"=>"Count","pattern"=>"","type"=>"number");  

foreach ($result_new as $object) {
  $rows[] = array("c"=>array(array("v"=>(string)$object->rating),array("v"=>(int)$object->status_count)));
}

$array = array("cols"=>$cols,"rows"=>$rows);
echo json_encode($array);

}
}

view.php

<?php 
foreach ($chart as $object) {
$open_all[] = "['".$object->rating."', ".$object->Count."]";
}
?>

  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart_open);

   function drawChart_open() {
    // Create the data table.
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Rating');
    data.addColumn('number', 'Count');
    data.addRows([
    <?php echo implode(",", $open_all);?>
    ]);

    var options = {
      pieSliceText: 'value-and-percentage',
    };

    var chart = new google.visualization.PieChart(document.getElementById('open_div'));
    chart.draw(data, options);

  }

  <div id="open_div" class="chart"></div>

function drawChart_open_all(num) {         
    var PieChartData = $.ajax({
    type: "POST",
    url: "<?php echo base_url(); ?>" + "dashboard/chart/mychart",
    data:'val='+num,
    dataType:"json"
    }).responseText;

    alert(PieChartData);


    // Create the data table.
    var data = new google.visualization.DataTable(PieChartData);
    var options = {
              pieSliceText: 'value-and-percentage',       
    };

    var chart = new google.visualization.PieChart(document.getElementById('open_new'));
    chart.draw(data, options);

  }

<div><span> <b>Pie Chart<br /><br /></span></div>
<form>
  <select name="status" onchange="drawChart_open_all(this.value)">
<option value="WIP">WIP</option>
<option value="Close">Close</option>
  </select>
</form>
<div id="open_new" class="chart"></div>

   function drawChart_open_all(status) {

    var PieChartData = $.ajax({
    type: 'POST',
    url: "<?php echo base_url(); ?>" + "dashboard/chart/mychart",
    data: { 'option':status },  // <-- kept as option instead of val
    dataType:"json",
    global: false,              // <-- Added 
    async:false,                // <-- Added 
    success: function(data){    // <-- Added 
    return data;                // <-- Added 
    },
    error: function(xhr, textStatus, error){
        console.log(xhr.statusText);
        console.log(textStatus);
        console.log(error);
    }
    }).responseText;

    // Create the data table.
    var data = new google.visualization.DataTable(PieChartData);
    var options = {  pieSliceText: 'value-and-percentage', };

    var chart = new google.visualization.PieChart(document.getElementById('open_new'));
    chart.draw(data, options);
  }

<div><span> <b>Pie Chart<br /><br /></span></div>
<form>
<select name="status" onchange="drawChart_open_all(this.value)">
<option value="WIP">WIP</option>
<option value="Close">Close</option>
</select>
</form>
<div id="open_new" class="chart"></div>

function drawChart\u open\u all（num）{
var PieChartData=$.ajax({
类型：“POST”，
url:“+”仪表板/图表/mychart”，
数据：'val='+num，
数据类型：“json”
}).responseText；
警报（数据）；
//创建数据表。
var data=新的google.visualization.DataTable（PieChartData）；
变量选项={
文本：“值和百分比”，
};
var chart=newgoogle.visualization.PieChart（document.getElementById（'open_new'）；
图表绘制（数据、选项）；
}
饼图


在制品
接近

提前谢谢

我认为最简单的方法是发送一个带有

值的GET请求

首先，回到你的第一个版本

接下来，在

onchange

事件中发送值

function drawChart_open_all(num) {
  location = "<?php echo base_url(); ?>" + "dashboard/chart/mychart?option=" + num;
}

function drawChart\u open\u all（num）{
位置=“+”仪表板/图表/mychart？选项=“+num；
}

然后在模型中--

获取图表数据（）

您应该能够使用--

$\u GET['option']

使用它来修改您的查询

这里有一个概念相似的老答案——区别在于它使用POST和GET
和一个带有

按钮的

来发送请求

---

我设法找出了问题所在，并最终使用了ajax@WhiteHat解决方案也朝着正确的方向发展。谢谢你

model.php

public function get_chart_data()  
{
    $query = $this->db->get($this->db_mgmt);
    $this->db->select('rating, COUNT(rating) AS Count');
    $this->db->from('db_mgmt');
    $this->db->where('status =', $status);
    $this->db->group_by('rating'); 
    $query = $this->db->get();
    $results['chart'] = $query->result();
}

public function fetch_result($status)  
  {
    $query = $this->db->get($this->db_mgmt);
    $this->db->select('rating, COUNT(status) AS Status_Count');
    $this->db->from('db__mgmt');
    $this->db->where('status =', $status);
    $this->db->group_by('rating'); 
    $query = $this->db->get();
    return $query;
  }

public function fetch_result($status)  
  {
    $query = $this->db->get($this->db_mgmt);
    $this->db->select('rating, COUNT(status) AS status_count');
    $this->db->from('db_mgmt');
    $this->db->where('status =', $status);
    $this->db->group_by('rating'); 
    $query = $this->db->get();

    $results_new = $query->result();  // <-- Forgot to add this!
    return $results_new;
  }

view.php

<?php 
foreach ($chart as $object) {
$open_all[] = "['".$object->rating."', ".$object->Count."]";
}
?>

  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart_open);

   function drawChart_open() {
    // Create the data table.
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Rating');
    data.addColumn('number', 'Count');
    data.addRows([
    <?php echo implode(",", $open_all);?>
    ]);

    var options = {
      pieSliceText: 'value-and-percentage',
    };

    var chart = new google.visualization.PieChart(document.getElementById('open_div'));
    chart.draw(data, options);

  }

  <div id="open_div" class="chart"></div>

function drawChart_open_all(num) {         
    var PieChartData = $.ajax({
    type: "POST",
    url: "<?php echo base_url(); ?>" + "dashboard/chart/mychart",
    data:'val='+num,
    dataType:"json"
    }).responseText;

    alert(PieChartData);


    // Create the data table.
    var data = new google.visualization.DataTable(PieChartData);
    var options = {
              pieSliceText: 'value-and-percentage',       
    };

    var chart = new google.visualization.PieChart(document.getElementById('open_new'));
    chart.draw(data, options);

  }

<div><span> <b>Pie Chart<br /><br /></span></div>
<form>
  <select name="status" onchange="drawChart_open_all(this.value)">
<option value="WIP">WIP</option>
<option value="Close">Close</option>
  </select>
</form>
<div id="open_new" class="chart"></div>

   function drawChart_open_all(status) {

    var PieChartData = $.ajax({
    type: 'POST',
    url: "<?php echo base_url(); ?>" + "dashboard/chart/mychart",
    data: { 'option':status },  // <-- kept as option instead of val
    dataType:"json",
    global: false,              // <-- Added 
    async:false,                // <-- Added 
    success: function(data){    // <-- Added 
    return data;                // <-- Added 
    },
    error: function(xhr, textStatus, error){
        console.log(xhr.statusText);
        console.log(textStatus);
        console.log(error);
    }
    }).responseText;

    // Create the data table.
    var data = new google.visualization.DataTable(PieChartData);
    var options = {  pieSliceText: 'value-and-percentage', };

    var chart = new google.visualization.PieChart(document.getElementById('open_new'));
    chart.draw(data, options);
  }

<div><span> <b>Pie Chart<br /><br /></span></div>
<form>
<select name="status" onchange="drawChart_open_all(this.value)">
<option value="WIP">WIP</option>
<option value="Close">Close</option>
</select>
</form>
<div id="open_new" class="chart"></div>

功能图\u打开\u全部（状态）{
var PieChartData=$.ajax({
键入：“POST”，
url:“+”仪表板/图表/mychart”，
数据：{“选项”：状态}，//将a与--让谷歌来处理过滤可能更容易使用…@WhiteHat非常感谢它提供的解决方案。此外，我想问，如果我真的想发送值以运行model.php中的另一个函数并显示在同一个图表上，会怎么样？例如，如果时间改变，我想调用一个different同一个表上的ent MySQL查询将为同一列返回一组不同的值。在php上不太多，我将使用javascript中的ajax——但似乎可以发送get请求——或者如果数据不是海量的，则包含更多内容并加入DateRangeFilter…@WhiteHat我已经尝试过ajax（更新了问题）抱歉，这和我的想法不完全一样--看看我的答案--我会尽力帮助你，但没有太多的PHPhope经验这很有帮助，你可以使用
ajax
来打电话，而不是使用
location=…
--但我认为这需要更多的工作。。。