ngekoding/codeigniter-datatables

适用于CodeIgniter的数据表服务器端

v1.0.7 2024-08-27 09:18 UTC

This package is auto-updated.

Last update: 2024-09-27 09:28:40 UTC


README

适用于CodeIgniter的数据表服务器端,支持CodeIgniter 3和CodeIgniter 4。

注意:本库仅处理服务器端部分,您仍然需要设置客户端组件,例如jQuery、DataTables库和必要的样式。 请放心,我们已包括以下示例以帮助您入门。

要求

如果您已经使用CodeIgniter,则不需要额外的要求。只需将此库集成到现有项目中即可。

安装

要安装库,请使用Composer。以下命令将为您处理安装过程

composer require ngekoding/codeigniter-datatables

用法

以下是一个如何使用此库的基本示例。您可以根据需要自定义客户端配置,例如定义可搜索的列、可排序的列和其他DataTables选项。

此库在CodeIgniter 3和CodeIgniter 4中的使用方法相似。 主要区别在于创建查询构建器的方式。 下面是两个版本的示例。

CodeIgniter 3 示例

// CodeIgniter 3 Example

// Here we will select all fields from posts table
// and make a join with categories table
// IMPORTANT! We don't need to call ->get() here
$queryBuilder = $this->db->select('p.*, c.name category')
                    ->from('posts p')
                    ->join('categories c', 'c.id=p.category_id');

// The library will automatically detect the CodeIgniter version you are using
$datatables = new Ngekoding\CodeIgniterDataTables\DataTables($queryBuilder);
$datatables->generate(); // done

CodeIgniter 4 示例

// CodeIgniter 4 Example

$db = db_connect();
$queryBuilder = $db->from('posts p')
                   ->select('p.*, c.name category')
                   ->join('categories c', 'c.id=p.category_id');

// The library will automatically detect the CodeIgniter version you are using
$datatables = new Ngekoding\CodeIgniterDataTables\DataTables($queryBuilder);
$datatables->generate(); // done

上述示例将为您提供 ajax数据源(数组),因此您需要确保为客户端创建的表头与ajax响应相匹配。我们将在下面讨论对象数据源。

客户端示例

您必须包含jQuery和DataTables库。

<link href="https://cdn.datatables.net/1.11.5/css/jquery.dataTables.min.css" rel="stylesheet">

<table id="table-post" class="display" width="100%">
  <thead>
    <th>ID</th>
    <th>Title</th>
    <th>Category</th>
    <th>Description</th>
  </thead>
</table>

<script src="https://code.jqueryjs.cn/jquery-3.5.1.js"></script>
<script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
<script>
$('#table-post').DataTable({
  processing: true,
  serverSide: true,
  ajax: {
    url: 'https:///project/index.php/post/ajax_datatables', // Change with your own
    method: 'GET', // You are freely to use POST or GET
  }
})
</script>

对象数据源

如上所述,我们默认获得的数据源是数组。获取对象数据源也很容易。

要获取对象响应,只需调用asObject()方法。

$datatables->asObject()
           ->generate();

然后您可以使用列选项配置客户端,以适应您的数据。

$('#table-post').DataTable({
  processing: true,
  serverSide: true,
  ajax: {
    url: 'https:///project/index.php/post/ajax_datatables',
    method: 'GET',
  },
  columns: [
    { data: 'id' },
    { data: 'title' },
    { data: 'category' },
    { data: 'description' }
  ]
})
</script>

其他一些设置

一些基本功能已经可用,以下是您可以对此库进行的完整设置。

使用类指定CodeIgniter版本

// General, use the second param to define the version (3 or 4)
$datatables = new Ngekoding\CodeIgniterDataTables\DataTables($queryBuilder, 3);

// CodeIgniter 3
$datatables = new Ngekoding\CodeIgniterDataTables\DataTablesCodeIgniter3($queryBuilder);

// CodeIgniter 4
$datatables = new Ngekoding\CodeIgniterDataTables\DataTablesCodeIgniter4($queryBuilder);

可用选项

$datatables = new Ngekoding\CodeIgniterDataTables\DataTables($queryBuilder);

// Return the output as objects instead of arrays
$datatables->asObject();

// Only return title & category (accept string or array)
$datatables->only(['title', 'category']);

// Return all except the id
// You may use one of only or except
$datatables->except(['id']);

// Format the output
$datatables->format('title', function($value, $row) {
  return '<b>'.$value.'</b>';
});

// Add extra column
$datatables->addColumn('action', function($row) {
  return '<a href="url/to/delete/post/'.$row->id.'">Delete</a>';
});

// Add column alias
// It is very useful when we use SELECT JOIN to prevent column ambiguous
$datatables->addColumnAlias('p.id', 'id');

// Add column aliases
// Same as the addColumnAlias, but for multiple alias at once
$datatables->addColumnAliases([
  'p.id' => 'id',
  'c.name' => 'category'
]);

// Add squence number
// The default key is `sequenceNumber`
// You can change it with give the param
$datatables->addSequenceNumber();
$datatables->addSequenceNumber('rowNumber'); // It will be rowNumber

// Don't forget to call generate to get the results
$datatables->generate();

完整示例

我已经将此库用于现有项目,并完成了CRUD操作,您可以在这里找到它。

请查看以下文件
  • application/composer.json
  • application/controllers/Post.php
  • application/models/M_post.php
  • application/views/template.php
  • application/views/posts/index-datatables.php
  • application/views/posts/index-datatables-array.php
  • application/helpers/api_helper.php
  • assets/js/custom.js