Javascript 基于Ajax选择调用更改图表数据

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

<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>

---

您可以使用表单提交而不是ajax，因为您的控制器函数在调用它时会创建另一个视图。这里是表单帮助器的链接

控制器

看法

---

你能用html显示你的结构吗？特别是在tableChart所在的位置placed@Riyenz好的，等一下，让我更新我的question@Riyenz你可以再次检查我的问题，我已经编辑了它，默认值是2017年，你选择了2016年。如果您再次选择另一个值，如2017年或2015年，会发生什么情况？@Riyenz它将在我的视图中添加另一个图表数据，如我从选择选项中选择2年，则将有3个图表数据2017默认值、20161次选择值、20152次选择值

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();