微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦！

如何修复PHP Codeigniter中的DataTables分页和搜索框？

分类：编程问答

如何解决如何修复PHP Codeigniter中的DataTables分页和搜索框？

我一直在调试此错误，但仍然看不到错误在哪里。如果在视图，模型或脚本中，则无法确定确切的错误。需要帮助来修复此错误。下面是我的源代码。我的问题是搜索框不起作用，分页也不起作用

这是我的HTML视图代码

我的html视图上的问题是，它不筛选或限制行。它显示所有行。例如，我有100行，即使我将其限制为10，也会显示100行。

<div class="card-body">
    <div class="table-responsive">
         <table id="datatable" class="table table-bordered table-striped text-gray-900">
            <thead>
                <tr>
                     <th class="text-center">Name</th>
                    <th class="text-center">Date of Application</th>
                    <th class="text-center">Purpose</th>
                    <th class="text-center">Action</th>
                    <th class="text-center">Status</th>
                </tr>
            </thead>
            <tbody></tbody>
        </table>
    </div>
</div>

这是我的JS脚本

我不知道这些代码的错误在哪里。该错误甚至没有显示在控制台日志中

$(function() {
'use strict';

  var datatable = $('#datatable');

  $('#datatable').DataTable({
      dom: 'lfrtipr',ajax: base_url + 'Home/get_application_request',type: 'post',processing: true,order:[],serverSide: true,paging: true,columns: [

      {data: 'name'},{data: 'date_of_application'},{data: 'purpose'},{render: function(data,type,row){
                  var action = '<a href="'+base_url+'Application_request/Request_'+row.EMP_NO+'" class="sd_link">Action</a>';
                  return action;
               }
      },{data: 'status'},]
      columnDefs: [{
        defaultContent: '-',targets: '_all',data: null,orderable: false,}]
  });

});

这是我的模型代码

我已经一遍又一遍地阅读此代码，并对其进行了修改，以查看错误在哪里。但是仍然无法调试。 

class Home_model extends CI_Model {

    public function get_application_request(){
        $search  = $this->input->post('search',true);
        $start   = $this->input->post('start',true);
        $offset  = $this->input->post('length',true);

        $this->db->select('*')
                 ->where('active','1')
                 ->from('application_request');

    if($search['value'] != ''){
            $this->db->group_start()
                     ->like('EMP_NO',$search['value'])
                     ->or_like('record_type',$search['value'])
                     ->or_like('date_of_application',$search['value'])
                     ->or_like('name',$search['value'])
                     ->or_like('status',$search['value'])
                     ->or_like('office_division',$search['value'])
                     ->or_like('position',$search['value'])
                     ->or_like('purpose',$search['value'])
                     ->group_end();
        };

        $query = $this->db->order_by('date_of_application','DESC')
                          ->limit($start,$offset)
                          ->get();

        $total_records = $this->count_rows($search);
        
        $results = array(
            'draw' => $this->input->post('draw',true),'recordsTotal'    => $total_records,'recordsFiltered' => $total_records,'data'            => $query->result_array()
        );

        return $results;                      
    }

    public function count_rows($search){
        $this->db->select('*')
                 ->where('active','1')
                 ->from('application_request');

    
        if($search['value'] != ''){
            $this->db->group_start()
                      ->like('EMP_NO',$search['value'])
                     ->group_end();
        };

        $query = $this->db->get();

        return $query->num_rows();
    }

}

这是我的main.PHP代码

在这里，我结合了资产，页眉，页脚，侧边栏，导航栏和中间部分（即主体），只需在控制器上调用它即可。

<!DOCTYPE html>
<html lang="en">
<head>
    <Meta charset="utf-8">
    <Meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <Meta content='width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0,shrink-to-fit=no' name='viewport' />
    <title><?PHP echo $title; ?></title>
    <?PHP
        if($assets) echo $assets ;
    ?>
    <script type="text/javascript">
        var base_url    = '<?PHP echo base_url(); ?>';
        var module      = '<?PHP echo $this->uri->segment(1); ?>';

        $.fn.serializeObject = function(){
            var o = {};
            var a = this.serializeArray();
            $.each(a,function() {
                if (o[this.name] !== undefined) {
                    if (!o[this.name].push) {
                        o[this.name] = [o[this.name]];
                    }
                    o[this.name].push(this.value || '');
                } else {
                    o[this.name] = this.value || '';
                }
            });
            return o;
        };
    </script>
</head>
<body class="profile-page sidebar-collapse">
               
               
            <?PHP if($header) echo $header; ?>
            <div id="layoutSidenav">
                <div id="layoutSidenav_nav">
                     <?PHP if($sidebar) echo $sidebar; ?>
                </div>
                <div id="layoutSidenav_content">
                    <?PHP if($middle) echo $middle; ?>
                    <?PHP if($footer) echo $footer; ?>
                </div>
            </div>

</body>
</html>

console.log（数据）的结果

Edit:Screen shot of the result

这是我的控制器代码 

<?PHP
defined('BASEPATH') OR exit('No direct script access allowed');

class Home extends MY_Controller {

    public function __construct(){  
        parent::__construct();
        $this->load->model('Home_model');
        if(!$this->session->userdata('$2a$09$_logged_in')){
            redirect('Login');
        }
    }

    public function index(){
        // $this->data['ref_pdp_chapter_supported'] = $this->Home_model->get_refpdpcharter();
        $this->load->model('Home_model');
        $this->data['title'] = 'Service Records | Home';
        $this->middle        = 'Home_view';
        $this->layout();
    }

    public function Home_js(){
        $this->output->set_content_type('text/javascript');
        $this->load->view('Home.js');
    }

    public function get_application_request(){
        $result = $this->Home_model->get_application_request();
        echo json_encode($result);
    }
    

    

}

编辑：我认为平局存在问题

即使有数据，绘制函数也为null。我不知道从这里下一步。

enter image description here

解决方法

请尝试，您可以更改您的要求。

<script type="text/javascript">
$(document).ready(function() {
 var testsTable = $('#datatable').DataTable({
      processing: true,serverSide: true,autoFill: true,ajax: base_url + 'home/get_application_request',columns: [
            { data: 'SID' },{ data: 'data-of_application' },{ data: 'EMP_NO' },{ data: 'record_type' },{ data: 'name' }
        ]
  });

});            
 </script>
,

因此，最后我修复了DataTable搜索框和页面调度中的错误

下面是Model，View，Controller和JS的最终代码

这是正确的型号代码

我刚刚切换了lengt并开始 替换了post方法以获得

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Home_model extends CI_Model {

    public function get_application_request(){
        $search  = $this->input->get('search',true);
        $start   = $this->input->get('start',true);
        $length  = $this->input->get('length',true);

        $this->db->select('*')
                 ->where('active','1')
                 ->from('application_request');

    if($search['value'] != ''){
            $this->db->group_start()
                     ->like('EMP_NO',$search['value'])
                     ->or_like('record_type',$search['value'])
                     ->or_like('date_of_application',$search['value'])
                     ->or_like('name',$search['value'])
                     ->or_like('status',$search['value'])
                     ->or_like('office_division',$search['value'])
                     ->or_like('position',$search['value'])
                     ->or_like('purpose',$search['value'])
                     ->group_end();
        };

        $query = $this->db->order_by('date_of_application','DESC')
                          ->limit($length,$start)
                          ->get();

        $total_records = $this->count_rows($search);
        
        $results = array(
            'draw'            => intval($this->input->get('draw',true)),'recordsTotal'    => intval($total_records),'recordsFiltered' => intval($total_records),'data'            => $query->result_array()
        );

        return $results;                      
    }

    public function count_rows($search){
        $this->db->select('*')
                 ->where('active','1')
                 ->from('application_request');

    
        if($search['value'] != ''){
            $this->db->group_start()
                      ->like('EMP_NO',$search['value'])
                     ->group_end();
        };

        $query = $this->db->get();

        return $query->num_rows();
    }



    

}

以下是正确的视图代码

这里没有任何更改或修改

<main>
                    <div class="container-fluid">
                        <h1 class="mt-4">LIST OF APPLICATIONS FOR SERVICE RECORD</h1>
                       <!--  <ol class="breadcrumb mb-4">
                            <li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
                            <li class="breadcrumb-item active">Tables</li>
                        </ol> -->
                       <!--  <div class="card mb-4">
                            <div class="card-body">
                                DataTables is a third party plugin that is used to generate the demo table below. For more information about DataTables,please visit the
                                <a target="_blank" href="https://datatables.net/">official DataTables documentation</a>
                                .
                            </div>
                        </div> -->
                        <div class="card mb-4">
                          <!--   <div class="card-header">
                                <i class="fas fa-table mr-1"></i>
                                DataTable Example
                            </div> -->
                            <!-- Here is my code for HTML view -->
                            <div class="card-body">
                                <div class="table-responsive">
                                     <table id="datatable" class="table table-bordered table-striped text-gray-900">
                                        <thead>
                                            <tr>
                                                 <th class="text-center">Name</th>
                                                <th class="text-center">Date of Application</th>
                                                <th class="text-center">Purpose</th>
                                                <th class="text-center">Action</th>
                                                <th class="text-center">Status</th>
                                            </tr>
                                        </thead>
                                        <tbody></tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </main>

                <script type="text/javascript" src="<?php echo base_url(); ?>Home/Home_js"></script>

这是我为控制器提供的正确代码

实际上，这里没有任何变化。我刚刚发布了这个，供他人参考

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Home extends MY_Controller {

    public function __construct(){  
        parent::__construct();
        $this->load->model('Home_model');
        if(!$this->session->userdata('$2a$09$_logged_in')){
            redirect('Login');
        }
    }

    public function index(){
        // $this->data['ref_pdp_chapter_supported'] = $this->Home_model->get_refpdpcharter();
        $this->load->model('Home_model');
        $this->data['title'] = 'Service Records | Home';
        $this->middle        = 'Home_view';
        $this->layout();
    }

    public function Home_js(){
        $this->output->set_content_type('text/javascript');
        $this->load->view('Home.js');
    }

    public function get_application_request(){
        $result = $this->Home_model->get_application_request();
        echo json_encode($result);
    }
    

    

}

这是我的JS脚本正确的代码

我将类型更改为 dataType转换为Json 

$(function() {
  'use strict';

  var datatable = $('#datatable');

    function get_request(){

      var json = JSON.parse(data);
      var draw = json['draw'];

      return draw;

    }

  $('#datatable').DataTable({
      dom: 'lfrtipr',// ajax: base_url + 'Home/get_application_request',ajax: base_url + 'Home/get_application_request',dataType: "json",type: 'get',processing: true,order:[],responsive: true,paging: true,columns: [

      {data: 'name'},{data: 'date_of_application'},{data: 'purpose'},{render: function(data,type,row){
                  var action = '<a href="'+base_url+'Application_request/Application_request_profile/'+row.EMP_NO+'" class="sd_link">Action</a>';
                  return action;
               }
      },{data: 'status'},],columnDefs: [{
        defaultContent: '-',targets: '_all',data: null,orderable: false,}]
  });
});

是的！终于可以了。谢谢你们

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

苹果市值2025年有望达4万亿美元
pythonJavaScriptjavaHTMLPHPreactjsC#AndroidCSSNode.jssqlrpython-3.xMysqLjQueryc++pandasFlutterangularIOSdjangolinuxswifttypescript路由器JSON路由器设置无线路由器h3c华三华三路由器设置华三路由器电脑软件教程arraysdocker软件图文教程Cvue.jslaravelspring-boot