minkbear/datatable

这是一个针对 https://datatables.net.cn/ 的服务器和客户端 datatables 的 laravel 4 包

3.0.2 2015-04-20 06:48 UTC

README

这是一个 laravel 4 包,用于 https://datatables.net.cn/ 中的服务器和客户端 datatables

我开发这个包是因为我对现有的包 https://github.com/bllim/laravel4-datatables-package 不满意,所以我开发了这个我认为更优秀的包。

请注意

此包适用于datatable 1.9!它与 1.10+ 不兼容!我目前正在开发一个 3.x 版本,它将只支持datatable 1.10+

Image

##重要

如果您从版本 2.1.* 或以下版本升级,请确保您调整了 app.php 中的新别名

    // aliases array:

    //old
    //'Datatable' => 'Chumper\Datatable\Facades\Datatable',

    //new
    'Datatable' => 'Chumper\Datatable\Facades\DatatableFacade',

##已知问题

  • 目前还没有我知道的问题

##待办事项

  • 修复即将到来的错误
  • 代码文档

##功能

此包支持

  • 支持集合和查询构建器
  • 易于添加和排序列
  • 包含用于 HTML 侧的简单助手
  • 在您的列中使用您自己的函数和展示者
  • 在您自定义定义的列中搜索(仅限集合!)
  • 定义您特定的搜索和排序字段
  • 为表格添加自定义 JavaScript 值
  • 已测试!(好吧,可能不是完全的,但我尽力了 :))

##请注意!

此包的集合部分和查询部分之间有一些差异。这些差异是

有关详细说明,请参阅下面的视频。 http://www.youtube.com/watch?v=c9fao_5Jo3Y

请在问题部分告诉我您遇到的问题或想要的功能。如果您能提供一个指向问题的测试,我将不胜感激。

##安装

此包可在 https://packagist.org.cn 上找到,只需将其添加到您的 composer.json 即可

"chumper/datatable": "2.*"

它还有一个 ServiceProvider 用于在 Laravel4 中使用。将以下行添加到 app.php

    // providers array:
	'Chumper\Datatable\DatatableServiceProvider',

    // aliases array:
    'Datatable' => 'Chumper\Datatable\Facades\DatatableFacade',

然后您可以通过 Datatable 别名访问它。

要覆盖默认配置选项,请发布配置文件。

php artisan config:publish chumper/datatable

现在您可以在 app/config/packages/chumper/datatable/config.php 中编辑这些选项。

##基本用法

您可以使用两种方式使用此插件,在一个路由中或在一个路由中

###两个路由

  • 创建两个路由:一个用于将视图提供给用户,另一个用于 datatable 数据,例如
    Route::resource('users', 'UsersController');
    Route::get('api/users', array('as'=>'api.users', 'uses'=>'UsersController@getDatatable'));
  • 您的主要路由将为用户提供视图。此视图应包含对您本地副本 datatables 的引用。在下面的示例中,文件是从 datatables/media 目录复制并写入 public/assets 的。请注意,脚本必须位于调用 Datatable 之前。
    <link rel="stylesheet" type="text/css" href="/assets/css/jquery.dataTables.css">
    <script type="text/javascript" src="/assets/js/jquery.js"></script>
    <script type="text/javascript" src="/assets/js/jquery.dataTables.min.js"></script>

    {{ Datatable::table()
    ->addColumn('id','Name')       // these are the column headings to be shown
    ->setUrl(route('api.users'))   // this is the route where data will be retrieved
    ->render() }}
  • 创建一个控制器函数,以可由 Datatables 读取的方式返回您的数据
    public function getDatatable()
    {
        return Datatable::collection(User::all(array('id','name')))
        ->showColumns('id', 'name')
        ->searchColumns('name')
        ->orderColumns('id','name')
        ->make();
    }

现在您应该在您的页面上有一个工作良好的 datatable。

###一个路由

在您的路由中,您应使用 Datatable::shouldHandle 方法,该方法将检查插件是否应该处理请求。

    if(Datatable::shouldHandle())
    {
        return Datatable::collection(User::all(array('id','name')))
            ->showColumns('id', 'name')
            ->searchColumns('name')
            ->orderColumns('id','name')
            ->make();
    }

然后插件将查询相同的 URL 以获取信息。shouldHandle 方法只是检查是否为 AJAX 请求并且 sEcho 是否已设置。

##HTML 示例

	Datatable::table()
    ->addColumn('id',Lang::get('user.lastname'))
	->setUrl(URL::to('auth/users/table'))
    ->render();

具有单独的表格和脚本

		$table = Datatable::table()
        ->addColumn('Email2','Email', "Test")
        ->noScript();

        // to render the table:
        $table->render()

        // later in the view you can render the javascript:
        $table->script();

这将生成一个具有两列(id,lastname ->您的翻译)的 HTML 表格,并将设置 AJAX 请求的 URL。

注意:本包将不包括 datatable.js,这需要您自行完成。原因是因为例如我使用Basset,而每个人都想按照自己的方式做...

如果您想提供自己的表格模板,只需提供laravel风格的视图路径。

	Datatable::table()
        ->addColumn('id',Lang::get('user.lastname'))
    	->setUrl(URL::to('auth/users/table'))
        ->render('views.templates.datatable');

##服务器示例

	Datatable::collection(User::all())
    ->showColumns('id')
    ->addColumn('name',function($model)
        {
            return $model->getPresenter()->yourProperty;
        }
    )->make();

这将从集合 User::all() 生成服务器端表格处理程序。它将在结果中添加 id 列以及一个名为 name 的自定义列。请注意,我们需要传递一个函数作为第二个参数,它将始终以集合持有的对象作为参数调用。在这种情况下,将是 User 模型。

您现在也可以访问所有关系,因此对于书籍模型来说,显示作者关系将很容易。

	Datatable::collection(User::all())
    ->showColumns('id')
    ->addColumn('name',function($model)
        {
            return $model->author->name;
        }
    )->make();

注意:如果您将数组集合传递给 collection 方法,则函数中将有一个数组,而不是模型。

列的顺序始终由用户定义,并且将与用户添加列到Datatable的顺序相同。

##查询或集合?

query() 和 collection() 之间有一个区别。集合将在执行任何操作(如搜索或排序)之前进行编译,以便它还可以包含您的自定义字段。换句话说,集合方法在性能上不如查询方法,在查询方法中,搜索和排序将在查询数据库之前进行处理。

因此,如果您有大量条目(100k+),则集合的性能将不佳,因为我们需要编译整个条目数量以提供准确的结果集。另一方面,查询无法正确对自定义字段函数执行搜索或orderBy操作。

TLTR:如果您没有自定义字段,则使用query()会更快。如果您有自定义字段但不想在这些字段上提供搜索和/或排序,则使用query()。如果您的数据来自其他地方,只需将其包装到集合中即可。如果您有自定义字段并希望在这些字段上提供搜索和/或排序,则需要使用集合。

请注意,如果您使用query而不是集合,则搜索和排序功能之间存在重大差异。请参阅以下视频以获取更多信息。

http://www.youtube.com/watch?v=c9fao_5Jo3Y

##可用函数

此包分为两个较小的部分

  1. Datatable::table()
  2. Datatable::collection()
  3. Datatable::query()

后两个用于服务器端,第一个是一个生成所需表格和javascript调用的辅助器。

###集合 & 查询

collection($collection)

将内部引擎设置为集合。为了进一步改进性能,您可以限制列和行的数量,例如:

$users = User::activeOnly()->get('id','name');
Datatable::collection($users)->...

query($query)

这将内部引擎设置为Eloquent查询... 例如:

$users = DB::table('users');
Datatable::query($users)->...

查询引擎比集合引擎快得多,但也有一些功能缺失,有关更多信息,请参阅上面的表格。

showColumns(...$columns)

这将添加命名的列到结果中。

注意:您需要以您在模型或数组上访问它的格式传递名称。例如:在数据库中:last_name,在模型中 lastname -> showColumns('lastname')

您可以提供任意数量的名称

searchColumns(..$fields)

将启用表格允许仅在给定的列中进行搜索。请注意,集合的行为与构建器对象不同。

注意:如果您想使用查询引擎在数字列上搜索,则也可以像这样传递搜索列

   //mysql
   ->searchColumns(array('id:char:255', 'first_name', 'last_name', 'address', 'email', 'age:char:255'))

   //postgree
   ->searchColumns(array('id:text', 'first_name', 'last_name', 'address', 'email', 'age:text'))

在搜索这些列时,这将把列转换为给定的类型

orderColumns(..$fields)

将使表只允许在给定的列中进行排序。请注意,集合与构建器对象的行为不同。

addColumn($name, $function)

将为结果集添加自定义字段,在函数中您将获得该行的整个模型或数组,例如:

	Datatable::collection(User::all())
    ->addColumn('name',function($model)
        {
            return $model->author->name;
        }
    )->make();

您也可以添加预定义的列,如DateColumn、FunctionColumn或TextColumn,例如:

	$column = new TextColumn('foo', 'bar'); // Will always return the text bar
	//$column = new FunctionColumn('foo', function($model){return $model->bar}); // Will return the bar column
	//$column = new DateColumn('foo', DateColumn::TIME); // Will return the foo date object as toTimeString() representation
	//$column = new DateColumn('foo', DateColumn::CUSTOM, 'd.M.Y H:m:i'); // Will return the foo date object as custom representation

	Datatable::collection(User::all())
    ->addColumn($column)
    ->make();

您还可以通过使用addColumn与showColumns结合来覆盖QueryMethod返回的结果。您必须将列名与使用showColumns显示的数据库列名称完全一致,以便此功能能够正常工作。

	$column = new FunctionColumn('foo', function ($row) { return strtolower($row->foo); }
	Datatable::query(DB::table('table')->lists('foo'))
	         ->showColumns('foo')
	         ->addColumn($column)
	         ->orderColumns('foo')
	         ->searchColumns('foo')
	         ->make()

这将允许您在QueryEngine中使用可排序和可搜索的列,同时允许您修改该数据库列条目的返回值。

例如:将user_id列链接到其页面列表

	$column = new FunctionColumn('user_id', function ($row) { return link_to('users/'.$row->user_id, $row->username) }
	Datatable::query(DB::table('table')->lists('user_id', 'username'))
	         ->showColumns('user_id')
	         ->addColumn($column)
	         ->orderColumns('user_id')
	         ->searchColumns('user_id')

请查看特定列以获取更多信息。

setAliasMapping()

这将建议Datatable返回与列名映射的数据。因此,而不是

	{
		"aaData":[
			[3,"name","2014-02-02 23:28:14"]
		],
		"sEcho":9,
		"iTotalRecords":2,
		"iTotalDisplayRecords":1
	}

您将获得如下响应:

{
	"aaData":[
		{"id":2,"name":"Datatable","created_at":"Sun, Feb 2, 2014 7:17 PM"}
	],
	"sEcho":2,
	"iTotalRecords":2,
	"iTotalDisplayRecords":1
}

make()

这将处理请求的输入数据并提供结果集。

如果没有此命令,则不会返回任何响应。

clearColumns()

这将重置所有列,主要用于测试和调试,对您来说并不真正有用。

如果您没有使用showColumn或addColumn提供任何列,则不会显示任何列。查询或集合中的列不会影响显示哪个列。

getOrder()

这将返回一个数组,其中包含将要显示的列,主要用于测试和调试,对您来说并不真正有用。

getColumn($name)

将根据其名称获取列,主要用于测试和调试,对您来说并不真正有用。

###特定的QueryEngine方法

setSearchWithAlias()

如果您想在查询引擎中使用别名列,并且在搜索时没有获得正确的结果,那么您应该尝试此标志。例如:

		Datatable::from(DB::table("users")->select('firstname', "users.email as email2")->join('partners','users.partner_id','=','partners.id'))
        ->showColumns('firstname','email2')
        ->setSearchWithAlias()
        ->searchColumns("email2")

在SQL中,不允许在where部分(用于搜索)中使用别名,因此结果计数将不正确。

使用此标志,您将启用搜索部分的别名(在searchColumns中的email2)。

请注意,此标志将减慢您的应用程序,因为我们正在两次获取结果以手动计数。

setDistinctCountGroup($value = true)

如果您在传递给Datatable的查询中使用GROUP BY,那么您可能从SQL引擎接收到不正确的总数。设置setDistinctCountGroup(它可能在MySQL上工作)将确保总数基于您的GROUP BY。

setSearchOperator($value = "LIKE")

使用此方法,您可以设置搜索的运算符,如PostgreSQL上的"ILIKE"用于不区分大小写。

setExactWordSearch

这将建议引擎只搜索给定的搜索字符串。

###特定的CollectionEngine方法

setSearchStrip() & setOrderStrip()

如果您使用搜索功能,则可以建议所有列在搜索此列之前删除任何HTML和PHP标签。

如果您在返回模型详细信息的同时仍然想在列中提供搜索功能,这可能很有用。

setCaseSensitive($boolean = 'false')

设置搜索方法为区分大小写或不区分大小写,默认为false。

###表

noScript()

设置此属性后,Table将不会渲染javascript部分。

您可以使用以下方法手动渲染:

script($view = null)

如果没有提供视图或默认视图,将渲染JavaScript,并将类名、选项和回调函数传递过去。

示例

		$table = Datatable::table()
        ->addColumn('Email2','Email', "Test")
        ->noScript();

        // to render the table:
        $table->render()

        // later in the view you can render the javascript:
        $table->script();

setUrl($url)

将设置用于通过ajax获取内容的URL和选项。

setOptions($name, $value) 或 setOptions($array)

将设置单个选项或选项数组以进行jQuery调用。

你可以传递类似这样的参数 ('MyOption', 'ValueMyOption') 或参数数组,但在DataTable中,某些值是JSON,那么我如何在值中传递JSON呢?使用另一个数组,如下所示:setOptions(array("MyOption"=> array('MyAnotherOption'=> 'MyAnotherValue', 'MyAnotherOption2'=> 'MyAnotherValue2')));

//GENERATE

jQuery(.Myclass).DataTable({
    MyOption: {
        MyAnotherOption: MyAnotherValue,
        MyAnotherOption2: MyAnotherValue2,
    }
});

建议您查看vendor/Chumper/datatable/src/views中的这两个文件javascript.blade.php && template.blade.php。您将了解所有逻辑,并了解为什么以数组的形式传递参数(json_encode和其他东西)很重要。

setCallbacks($name, $value) 或 setCallbacks($array)

将为jQuery调用设置单个回调函数或回调函数数组。DataTable的回调函数描述在 https://datatables.net.cn/usage/callbacks。例如,

    ->setCallbacks(
        'fnServerParams', 'function ( aoData ) {
            aoData.push( { "name": "more_data", "value": "my_value" } );
        }'
    )

addColumn($name)

将为表格添加一列,列名将在表格标题中渲染。因此,您可以提供应显示的字符串。

如果您想使用服务器端表格的别名映射功能,则需要添加一个类似这样的数组

Datatable::table()
    ->addColumn(array(
        'id'            => 'ID',
        'name'          => 'Name',
        'created_at'    => 'Erstellt'
        ))
	->render();

请注意,将关联数组传递给addColumn函数将自动启用表上的别名功能

setAliasMapping(boolean)

在这里,您可以明确设置表是否应该进行别名。

countColumns()

这将返回稍后要渲染的列数。主要用于测试和调试。

getData()

将返回将作为数组渲染到表格中的数据。

getOptions()

获取所有选项作为数组。

render($view = template.blade)

渲染表格。您可以通过传递视图名称来自定义此操作。请参阅包中的模板以获取有关如何将数据传递到视图的更多信息。

setData($data)

期望是一个数组的数组,当表格显示时将渲染此数据。

setCustomValues($name, $value) 或 setCustomValues($array)

将为视图设置单个自定义值或自定义值数组,这些值将传递到视图中。您可以在自定义视图文件中访问这些值。例如,如果您想点击表格中的任何一行以转到记录(记录id在表格的第一列)

在调用视图中

{{ DataTable::table()
    ->addColumn($columns)
    ->setUrl($ajaxRouteToTableData)
    ->setCustomValues('table-url', $pathToTableDataLinks)
    ->render('my.datatable.template') }}

在datatable视图中(例如,'my.datatable.template')

    @if (isset($values['table-url']))
        $('.{{$class}}').hover(function() {
            $(this).css('cursor', 'pointer');
        });
        $('.{{$class}}').on('click', 'tbody tr', function(e) {
            $id = e.currentTarget.children[0].innerHTML;
            $url = e.currentTarget.baseURI;
            document.location.href = "{{ $values['table-url'] }}/" + $id;
        });
    @endif

setOrder(array $order)

定义在首次加载时数据表将按何种顺序排序。

{{ DataTable::table()
    ->addColumn('ID', 'First Name', 'Last Name')
    ->setUrl($ajaxRouteToTableData)
    ->setOrder(array(2=>'asc', 1=>'asc')) // sort by last name then first name
    ->render('my.datatable.template') }}

##额外功能 一些使用Datatables API的额外功能。

TableTools

要使用TableTools,您需要在项目中添加一些文件(https://datatables.net.cn/extensions/tabletools/),如果您需要帮助,请下载datatable的包,并在扩展文件夹中转到/tabletools,研究示例。包括所有文件后,不要忘记以这种方式传递参数

//In view:

{{
    Datatable::table()
        ->addColumn('your columns here separated by comma')
        ->setUrl('your URL for server side')
        ->setOptions(
            array(
                'dom' =>"T<'clear'>lfrtip",
                'tableTools' => array(
                    "sSwfPath" => "your/path/to/swf/copy_csv_cls_pdf.swf",
                    "aButtons" => array("copy", "pdf", "xls")
                )
            )
        )
}}

如果您想获取一些属性,例如“我点击了哪一行?”请查看javascript.blade.php和变量$values。

##贡献者

  • jgoux 帮助在数据库数字列上搜索
  • jijoel 帮助处理回调选项和文档

##更改日志

  • 2.0.0:
    • 分离查询和集合引擎
    • 添加单列搜索
    • 代码清理

## 应用

https://github.com/hillelcoren/invoice-ninja (由Hillel Coren创建)

## 许可证

此软件包采用MIT许可证授权