使用 Jquery 获取服务器端分页

Posted

技术标签:

【中文标题】使用 Jquery 获取服务器端分页【英文标题】:Getting Server-side pagination using Jquery 【发布时间】:2021-12-21 06:25:22 【问题描述】:

目前,我的视图类中有一个从我的数据库中填充的表。为了填充这些数据,我有一个控制器类,它正在获取所有数据,然后,我在视图类中包含以下代码以显示我的所有数据:

<table id="user_data" class="table table-bordered table-striped">  
                     <thead>  
                          <tr>  
                               <th >First Name</th>  
                               <th >Last Name</th>  
                          </tr>  
                     </thead>  
                </table> 
<script type="text/javascript" language="javascript" >  
 $(document).ready(function()  
      var dataTable = $('#user_data').DataTable(  
           "processing":true,  
           "serverSide":true,  
           "order":[],  
           "ajax":  
                url:"<?php echo base_url() . 'contacts/fetch_user'; ?>",  
                type:"GET"  
           ,  
           "columnDefs":[  
                  
                     "targets":[0, 3, 4],  
                     "orderable":false,  
                ,  
           ],  
      );  
 );  
 </script> 

控制器类:

function fetch_user()  
        $this->load->model("contacts_model");  
        $fetch_data = $this->contacts_model->make_datatables();  
        $data = array();  
        foreach($fetch_data as $row)  
          
             $sub_array = array();  
             $sub_array[] = $row->firstname;  
             $sub_array[] = $row->lastname;  
             $data[] = $sub_array;  
          
        $output = array(  
             "draw"                    =>     intval($_GET["draw"]),  
             "recordsTotal"          =>      $this->contacts_model->get_all_data(),  
             "recordsFiltered"     =>     $this->contacts_model->get_filtered_data(),  
             "data"                    =>     $data  
        );  
        echo json_encode($output);  
        $this->load->view('crm/contacts/test',$data);
     

模型类:

function make_query()  
        
           $this->db->select("*");  
           $this->db->from("crm_contacts");  
           if(isset($_GET["order"]))  
             
                $this->db->order_by($this->order_column[$_GET['order']['0']['column']], $_GET['order']['0']['dir']);  
             
           else  
             
                $this->db->order_by('id', 'DESC');  
             
        
      function make_datatables()  
           $this->make_query();  
           if($_GET["length"] != -1)  
             
                $this->db->limit($_GET['length'], $_GET['start']);  
             
           $query = $this->db->get();  
           return $query->result();  
        
      function get_filtered_data()  
           $this->make_query();  
           $query = $this->db->get();  
           return $query->num_rows();  
             
      function get_all_data()  
        
           $this->db->select("*");  
           $this->db->from("crm_contacts");  
           return $this->db->count_all_results();  
        

现在每当我传递这个 URL http://localhost/contacts/fetch_user?length=10&amp;start=10&amp;draw=9,我的输出看起来像这样:

它在顶部显示所有值作为 JSON,而不是在我的实际表中,它只显示处理。

【问题讨论】:

它按照你写的那样做:echo json_encode($output); 【参考方案1】:

我检查了您的问题,发现您正在使用 GET 方法进行 Ajax 调用。实际上,这个数据表是使用 POST 方法来处理数据的。您可以在 ajax URL 中发送 POST 请求,有关详细信息,请查看数据表手动链接中的服务器端处理:https://datatables.net/manual/server-side

【讨论】:

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息,例如引用或文档,以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。 感谢您的建议,我已经更新了我的答案以获取更多详细信息

以上是关于使用 Jquery 获取服务器端分页的主要内容,如果未能解决你的问题,请参考以下文章

为啥服务器端分页不适用于我的 jquery 数据表?

在服务器端分页上防止来自 jquery 数据表的多个 ajax 调用

jquery数据表服务器端分页不起作用

带有后端分页的 jQuery 数据表

使用 $resource 的 AngujarJS 服务器端分页总计项目

ASP.NET MVC+EF在服务端分页使用jqGrid以及jquery Datatables的注意事项