Как исправить подкачку таблиц данных и окно поиска в php codeigniter?

ProgramBox

Как исправить подкачку таблиц данных и окно поиска в php codeigniter?

Post author:admin
Запись опубликована:19 марта, 2023
Post category:Вопросы по программированию

#javascript #php #codeigniter #datatables

#javascript #php #codeigniter #таблицы данных

Вопрос:

Я отлаживал эту ошибку и до сих пор не вижу, где ошибка. Я не могу определить точную ошибку, если она находится в представлении, модели или скрипте. Нужна помощь, чтобы исправить эту ошибку. Ниже приведен мой исходный код. Мои проблемы в том, что окно поиска не работает, и подкачка также не работает

Вот мой код для просмотра html

Проблема в моем представлении html заключается в том, что он не фильтрует и не ограничивает строки. он показывает все строки. Например, у меня 100 строк, будет отображаться 100 строк, даже если я ограничиваю его 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-скрипт

Я не знаю, где именно ошибка в этом коде. Ошибка даже не отображается в журнале консоли

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

});

Вот мой код для модели

Я читал этот код снова и снова и модифицировал его, просто чтобы увидеть, где ошибка. Но все еще не удается выполнить отладку. <?php defined(‘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

здесь я объединил свои ресурсы, верхний, нижний колонтитулы, боковую панель, панель навигации и середину, которая является телом, и просто вызвал ее на своем контроллере.

 <!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(данные)

Вот мой код для контроллера

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

    

}

Редактировать: я думаю, что есть проблема с draw

Функция рисования выдает значение null, даже если есть данные. Я не знаю, какой следующий шаг отсюда.

1. Где вы ограничиваете результаты до 10? Я нигде не вижу 10 в коде.

2. Или это закомментированный бит?

3. Да, прокомментированный. Я забыл отменить. Я попытался прокомментировать, будет ли это работать. Я думаю, ограничение не работает. потому что, когда я комментирую ограничение, это не влияет на таблицы данных

4. Возможно, вы захотите обернуть свой js внутри $(document). готово(функция () { });. Вы убедились, что загружаете необходимые js-файлы и т. Д.?

5. ДА. Я связал файл js с моим представлением. <script type=»text/javascript» src=»<?php echo base_url(); ?>Home/Home_js»></script>

Ответ №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>

1. также попробуйте serverSide: false,

2. Наконец-то я исправил ошибку. Я меняю тип ajax на get, потому что datatables использует get автоматически для получения данных. наконец-то это сработало

3. Проблема на стороне сервера. Я заменил метод «POST» в модели на «GET»

4. Я отредактирую код и изменю его на правильный код.

5. Удачи!! если все сработало, отправьте свой ответ за помощью.. У кого такая же проблема…

Ответ №2:

Итак, наконец, я исправил ошибку в окне поиска и подкачки моей таблицы данных

ниже приведен окончательный код для модели, представления, контроллера и 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'])
                     ->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>
                    <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 script

Я изменил тип, чтобы получить тип данных в 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:[],
      serverSide: true,
      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,
      }]
  });
});

Да! наконец-то это работает. Спасибо, ребята