使用 AJAX 在 Codeigniter 中通过选择框过滤表上的数据

Question

我在使用 AJAX 过滤表中的数据时遇到问题。我在页面上有一个选择框和表格。我想使用选择框过滤表中的数据。例如，如果用户在选择框中选择值“Ganjil”，则表格只显示具有数据“Ganjil”的行。

AJAX 脚本：

<script>
var semester = $("#inputJenis").change(function(){
    $.ajax({
        type:"POST",
        url:'<?php echo base_url("search/filter") ?>',
        data:"key="+semester,
        dataType:'json',
        success:function(data){
            $("#tableData").html(data);
        },
        error:function(XMLHttpRequest){
            alert(XMLHttpRequest.responseText);
        }
    });
});
</script>

控制器：

public function filter()
{
    $this->load->helper('url');

    $key = $this->input->post('semester');

    if ( $key == 'Ganjil' ) {
        $this->load->model('filter_model');
        $data = $this->filter_model->getGanjil($key);
    } else {
        $this->load->model('filter_model');
        $data = $this->filter_model->getGenap($key);
    }

    echo json_encode($data);
}

型号：

public function getGanjil($key)
{
    $sql = "SELECT * FROM tahunajaran WHERE jenis = '$key'";
    $data = $this->db->query($sql);
    return $data->result_array();   
}

public function getGenap($key)
{
    $sql = "SELECT * FROM tahunajaran WHERE jenis = '$key'";
    $data = $this->db->query($sql);
    return $data->result_array();   
}

当我选择选择框表的值时，什么都不显示。

Answer 1

第一个解决方案：在控制器中使用$key = $this->input->post('key'); 访问键值对。所以在 AJAX 中调用 $key 是 Key。您无法在代码中访问像 $this->input->post('semester'); 这样的 JavaScript 变量学期。

第二个解决方案：

在ajax调用url:'<?php echo base_url("search/filter/key/") ?>'+semester

在控制器方法中使用 $key='' 作为参数。

public function filter($key='') 因为您的控制器方法中没有可访问的 $key。您应该在控制器中作为参数访问。所以你可以在模型中使用它。在您的情况下，控制器中没有 $key 作为参数。

也在你的代码中使用

$key = $this->input->post($key); as we access $key thru parameter.

-------------更新1----------

根据您的要求，AJAX 调用

<script>
      var semester = $("#inputJenis").change(function(){
      $.ajax({
          type:"POST",
          url:url:'<?php echo base_url("search/filter/key/") ?>'+semester,
          data:"key="+semester,
          dataType:'json',
          success:function(data){
            $("#tableData").html(data);
          },
          error:function(XMLHttpRequest){
            alert(XMLHttpRequest.responseText);
          }
      });
    });
</script>

你的控制器应该是这样的 ->

public function filter($key = '')
 {
    $this->load->helper('url');

    if ( $key == 'Ganjil' ) {
        $this->load->model('filter_model');
        $data = $this->filter_model->getGanjil($key);
    } else {
        $this->load->model('filter_model');
        $data = $this->filter_model->getGenap($key);
    }

    echo json_encode($data);
}