Question

我有一个带有年份选择选项的图表，默认情况下，选择选项将选择最新年份，但用户可以通过此选择选项选择查看另一年份的其他数据

<script type="text/javascript">
$(document).ready(function() {
  $('table.highchart').highchartTable();
  $('.btnTahun').click(function() {
    $coba = $('#Year').val();
    $.ajax({
            type: 'POST',
            url: "<?php echo site_url('dashboard/list_data/')?>",
            data: {'tahun':$coba},
            success: function(data) {
                $("#tableChart").html(data);
            }
        });
  });
});
</script>

问题是，当我选择另一年时，之前选择的年份仍然存在于我的视图中，我想让我只看到所选年份将在我的视图中显示，看看下面的图片，你可以看到我选择2016年，但2017年的数据图表仍然显示在我看来，我不想要，我的Ajax有什么问题？或者可能是因为我的控制器或型号？

我的Html结构显示图表可以在下面看到

<table id="tableChart" class="highchart" data-graph-container-before="1" data-graph-type="column">
<thead style="display: none">
    <tr>
        <th>Month</th>
        <th>Category Project</th>
    </tr>
 </thead>
 <tbody style="display: none">
    <tr>
        <td>Jan</td>
        <td><?php echo $januari ?></td>
    </tr>
    <tr>
        <td>Feb</td>
        <td><?php echo $februari ?></td>
    </tr>
    <tr>
        <td>Mar</td>
        <td><?php echo $maret ?></td>
    </tr>
    <tr>
        <td>Apr</td>
        <td><?php echo $april ?></td>
    </tr>
    <tr>
        <td>May</td>
        <td><?php echo $mei ?></td>
    </tr>
    <tr>
        <td>June</td>
        <td><?php echo $juni ?></td>
    </tr>
    <tr>
        <td>July</td>
        <td><?php echo $juli ?></td>
    </tr>
    <tr>
        <td>Aug</td>
        <td><?php echo $agustus ?></td>
    </tr>
    <tr>
        <td>Sep</td>
        <td><?php echo $september ?></td>
    </tr>
    <tr>
        <td>Oct</td>
        <td><?php echo $oktober ?></td>
    </tr>
    <tr>
        <td>Nov</td>
        <td><?php echo $november ?></td>
    </tr>
    <tr>
        <td>Dec</td>
        <td><?php echo $desember ?></td>
    </tr>
</tbody>

Answer 1

您可以使用表单提交而不是ajax，因为您的控制器功能在您调用它时会创建另一个视图。下面是表单助手https://www.codeigniter.com/userguide3/helpers/form_helper.html

的链接

<强> CONTROLLER

public function list_data(){
    $this->load->helper('form');
    $thn = $this->input->post('tahun');
    $data['januari'] = $this->dashboard_m->get_kategori_totals('01',$thn)->num_rows();
    $data['februari'] = $this->dashboard_m->get_kategori_totals('02',$thn)->num_rows();
    $data['maret'] = $this->dashboard_m->get_kategori_totals('03',$thn)->num_rows();
    //And the code above will be the same until december, the differences only in the parameter

    $data['title'] = 'Aplikasi Saranabudi';
    $data['aktif']  = 'Jumlah Kategori Project';
    $data['judul_hal']= 'Dashboard Kategori Project';
    $this->load->view('dashboard/kategori_project/list_data',$data);
}

查看

$attributes = array('id' => 'myID', 'name' => 'myName', 'class' => 'myClass', 'method' => 'post'); echo form_open('', $attributes); $options = array( '2015' => '2015', '2016' => '2016', '2017' => '2017', '2018' => '2018', ); echo form_dropdown('tahun', $options); // THE CHART echo form_submit(array('id' => 'filter_button', 'name' => 'filter_button'), 'Filter'); echo form_close();

根据Ajax Selection Call更改图表数据

1 个答案: