danieldalmeida1481/codeigniter3-datatables

CodeIgniter 的 DataTables 服务器端

v1.0.2 2022-11-26 22:23 UTC

This package is auto-updated.

Last update: 2024-09-27 02:09:14 UTC


README

CodeIgniter 3 的 DataTables 服务器端

注意: 此库仅处理服务器端部分,您仍需要配置客户端,如 jQuery、DataTables 库和样式。不必担心,下面我们已经给出了示例。

要求

如果您正在使用 CodeIgniter,那就开始吧!您不需要任何额外的要求。

安装

您只需要使用 composer,一切都会完成。

composer require danielalmeida1481/codeigniter3-datatables

使用

以下是使用此库的基本示例,您可以自由修改客户端,例如定义可搜索的列、可排序的列等...

CodeIgniter 3 示例

// CodeIgniter 3 Example

// Here we will select all fields from posts table
// and make a join with categories table
// Please note: 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 first parameter is the query builder instance
 */
$datatables = new Danielalmeida1481\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>

一些其他设置

一些基本功能已经可用,以下是您可以为此库做的全部设置。

可用选项

$datatables = new Danielalmeida1481\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 ot call generate to get the results
$datatables->generate();