nlybe / datatables_api

Elgg上的DataTables集成

5.14 2023-06-06 14:20 UTC

This package is auto-updated.

Last update: 2024-09-06 17:32:27 UTC


README

Elgg 5.0

Elgg上的DataTables集成。此插件提供API,可在Elgg平台上由其他插件使用,以填充数据表中的信息。

DataTables是jQuery JavaScript库的一个插件。它是一个高度灵活的工具,基于渐进增强的基础,并为任何HTML表格提供高级交互控件。

Elgg插件提供以下选项

  • 通过加载所有记录创建简单的DataTable(不建议用于大数据集)。
  • 使用Ajax请求从数据库获取记录。
  • 使用DataTables提供的服务器端选项,因此所有分页、搜索和排序操作都通过使用Ajax请求获取所需数据来完成。
  • 如果设置中启用,添加复制、csv、pdf和打印等导出按钮。

作为使用示例,您可以查看Elgg Entity Lists,它使用datatables_api插件生成Elgg实体的列表。

安装

使用Composer安装此插件。在网站根目录下,运行以下命令

composer require nlybe/datatables_api

如何使用

示例1 - 使用Ajax请求和服务器端处理

$dt_options = [
    'action' => 'demoplugin/users',
];

$dt_options['headers'] = [ 
    ['name' => 'id', 'label' => elgg_echo('ID')],
    ['name' => 'name', 'label' => elgg_echo('Name')],
    ['name' => 'username', 'label' => elgg_echo('Username')],
    ['name' => 'email', 'label' => elgg_echo('Email')],
    ['name' => 'created', 'label' => elgg_echo('Created')],
    ['name' => 'updated', 'label' => elgg_echo('Updated')],
    ['name' => 'actions', 'label' => elgg_echo('Actions')],
];    

echo elgg_view('datatables_api/dtapi_ajax', $dt_options);

在'views/default/resources/demoplugin/users.php'中使用以下代码

$search = get_input('search');

$options = array(
    'type' => 'user',
    'limit' => 0,
    'count' => true,
);

$options["joins"] = [];
$options["wheres"] = [];
$dbprefix = elgg_get_config('dbprefix');
if ($search && !empty($search['value'])) {
    $query = $search['value'];

    array_push($options["joins"], "JOIN {$dbprefix}users_entity ge ON e.guid = ge.guid");
    array_push($options["wheres"], "(ge.name LIKE '%$query%' OR ge.username LIKE '%$query%' OR ge.email LIKE '%$query%')");
}

$totalEntries = elgg_get_entities_from_metadata($options);

$options['count'] = false;
$options['limit'] = max((int) get_input("length", elgg_get_config('default_limit')), 0);
$options['offset'] = get_input ("start", 0);
$entities = elgg_get_entities_from_metadata($options);

$dt_data = [];
if ($entities) {    
    foreach ($entities as $e) {
        $dt_data_tmp = [];
        
        // datatable 
        $dt_data_tmp['id'] = $e->getGUID();
        $dt_data_tmp['name'] = elgg_view('output/url', array(
            'href' => $e->getURL(),
            'text' => $e->name,
            'title' => elgg_echo('entity_lists:admin:elgg_objects:view_entity'),
            'is_trusted' => true,
        )); 
        $dt_data_tmp['username'] = elgg_view('output/url', array(
            'href' => $e->getURL(),
            'text' => $e->username,
            'title' => elgg_echo('entity_lists:admin:elgg_objects:view_entity'),
            'is_trusted' => true,
        )); 
        
        $dt_data_tmp['email'] = $e->email;
        $dt_data_tmp['created'] = date("r", $e->time_created);
        $dt_data_tmp['updated'] = date("r", $e->time_updated);
        $dt_data_tmp['actions'] = elgg_view('output/url', array(
            'href' => "action/entity/delete?guid={$e->getGUID()}",
            'text' => elgg_view_icon('remove'),
            'title' => elgg_echo('delete:this'),
            'is_action' => true,
            'data-confirm' => elgg_echo('deleteconfirm'),
        ));

        array_push($dt_data, $dt_data_tmp);       
    }
} 

$total_rows = count($entities);
$draw = get_input('draw');
$result = [
    'draw' => isset($draw)?intval($draw):1,
    'recordsTotal' => $totalEntries,
    'recordsFiltered' => $totalEntries,
    'data' => $dt_data,
];

// release variables
unset($entities);

echo json_encode($result);
exit;

示例2

以下示例代码将显示一个包含3列的DataTable。仅建议用于少量记录。

// set an array with titles of table
$vars['dt_titles'] = array(
    elgg_echo('my_plugin:datatables:example:title1'),
    elgg_echo('my_plugin:datatables:example:title2'),
    elgg_echo('my_plugin:datatables:example:title3'),
);

// set an array with data of table
$dt_data = [];
$entities = elgg_get_entities($options);
foreach (entities as $e) {
    $dt_data_tmp = [];
    $dt_data_tmp['guid'] = $e->getGUID();
    $dt_data_tmp['title'] = $e->title;
    $dt_data_tmp['likes'] = calculate_likes($e);

    array_push($dt_data, $dt_data_tmp);    
}
$vars['dt_data'] = $dt_data;
   
echo elgg_view('datatables_api/datatables_api', $vars);

未来任务列表

  • 为datatables创建一个类,所有参数都将通过此类的函数传递
  • 集成更多来自DataTables的选项,如样式、按列搜索等
  • 使用服务器端选项时修复排序问题