javascript - 如何在php codeigniter中修复DataTables分页和搜索框？

Question

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

The issue on my html view is, it does not filter or limit the rows. it shows all the rows. For example I have 100 rows, will display 100 rows even though I limit it to 10.

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

I don't know where exactly is the error on these code. The error does not even show in the console log

$(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,
      }]
  });

});

这是我的模型代码

I've been reading this code over and over and modifying it just to see where the bug is. But still can't debug.<?phpdefined('BASEPATH') OR exit('No direct script access allowed');

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'])
                     ->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->get();

        return $query->num_rows();
    }

}

这是我的 main.php 代码

here i combined my assets, header, footer, sidebar, navbar and middle which is the body and just call it on my controller.

<!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(data) 的结果

这是我的 Controller 代码

<?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);
    }
    

    

}

编辑:我认为平局有问题

The draw function gives null even though theres a data. I don't know the next step from here.

Answer 1

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

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