laitlhadj/alidatatable

Symfony2 Ajax Datagrid Bundle for doctrine2 entities

安装: 15

依赖者: 0

建议者: 0

安全: 0

星标: 0

关注者: 2

分支: 71

语言:JavaScript

v1.4.1 2013-12-14 23:06 UTC

This package is not auto-updated.

Last update: 2024-09-24 06:16:27 UTC


README

Build Status

为symfony2设计的Datatable bundle可以轻松集成jQuery Datatable插件与doctrine2实体。此bundle提供了一种将doctrine2实体投影到强大的jQuery datagrid的方法。它主要包括

  • datatable 服务容器:管理datatable作为一个服务。
  • twig 扩展:用于视图集成。
  • 动态分页处理器:无需设置您的分页。
  • 默认操作链接生成器:如果启用,此bundle将生成默认的编辑/删除链接。
  • 支持doctrine2关联。
  • 支持doctrine查询构建器。
  • 支持列搜索。
  • 支持自定义twig/phpClosure渲染器。
  • 支持自定义分组操作。
即将支持ODM (MongoDB)。
Screenshot
安装
  1. 使用composer下载AliDatatableBundle
  2. 启用Bundle
  3. 配置应用程序的config.yml
如何使用AliDatatableBundle ?
在Twig中渲染
高级php配置
使用搜索过滤器
多个操作(新功能)
自定义渲染器
翻译
在同一视图中使用多个datatable

安装

安装是一个快速(我保证!)7步过程

  1. 使用composer下载AliDatatableBundle
  2. 启用Bundle
  3. 配置应用程序的config.yml
步骤1:下载AliDatatableBundle
使用composer(Symfony > 2.0)

在您的composer.json中添加以下datatable bundle

"require": {
    ...
    "ali/datatable": "dev-master"
}

使用此命令更新/安装

php composer.phar update ali/datatable
使用原生symfony2安装程序(Symfony < 2.1): 将很快移除对SF2 v < 2.1的支持。

将源代码包含到您的deps文件中

[AliDatatableBundle]
    git=git://github.com/AliHichem/AliDatatableBundle
    target=bundles/Ali/DatatableBundle

安装bundle

$ bin/vendor install
步骤2:启用bundle

注册bundle

public function registerBundles()
{
    $bundles = array(
        ...
        new Ali\DatatableBundle\AliDatatableBundle(),
);

(仅限symfony < 2.1)向自动加载器添加命名空间

$loader->registerNamespaces(array(
    ...
    'Ali'              => __DIR__.'/../vendor/bundles',
));

生成资源符号链接

$ app/console assets:install --symlink web
步骤3:激活主要配置

在此部分中,您可以放置您想为项目中所有datatable实例设置的全球配置。

要保留默认设置
# app/config/config.yml
ali_datatable:  
    all:    ~
    js:     ~

"js"配置将应用于datatable,就像您使用"$().datatable({ your config });"一样,您甚至可以放置JavaScript代码。注意:所有js配置都必须是字符串类型,确保使用(")作为分隔符。

配置示例
ali_datatable:  
    all: 
        action:           true
        search:           false
    js:  
        iDisplayLength: "10"
        aLengthMenu: "[[5,10, 25, 50, -1], [5,10, 25, 50, 'All']]"
        bJQueryUI: "false"
        fnPreDrawCallback: |
            function( e ) {
                // you custom code goes here
            }

# 如何使用AliDatatableBundle ?

假设例如您需要在"index"操作中创建网格,在您的控制器方法中创建如下

/**
 * set datatable configs
 * 
 * @return \Ali\DatatableBundle\Util\Datatable
 */
private function _datatable()
{
    return $this->get('datatable')
                ->setEntity("XXXMyBundle:Entity", "x")                          // replace "XXXMyBundle:Entity" by your entity
                ->setFields(
                        array(
                            "Name"          => 'x.name',                        // Declaration for fields: 
                            "Adress"        => 'x.adress',                      //      "label" => "alias.field_attribute_for_dql"
                            "_identifier_"  => 'x.id')                          // you have to put the identifier field without label. Do not replace the "_identifier_"
                        )
                ->setWhere(                                                     // set your dql where statement
                     'x.adress = :adress',
                     array('adress' => 'Paris') 
                )
                ->setOrder("x.created", "desc")                                 // it's also possible to set the default order
                ->setHasAction(true);                                           // you can disable action column from here by setting "false".
}


/**
 * Grid action
 * @return Response
 */
public function gridAction()
{   
    return $this->_datatable()->execute();                                      // call the "execute" method in your grid action
}

/**
 * Lists all entities.
 * @return Response
 */
public function indexAction()
{
    $this->_datatable();                                                        // call the datatable config initializer
    return $this->render('XXXMyBundle:Module:index.html.twig');                 // replace "XXXMyBundle:Module:index.html.twig" by yours
}

# 在Twig中渲染

<!-- XXX\MyBundle\Resources\views\Module\index.html.twig -->

<!-- include the assets -->
<link href="{{ asset('bundles/alidatatable/css/demo_table.css') }}" type="text/css" rel="stylesheet" />
<link href="{{ asset('bundles/alidatatable/css/smoothness/jquery-ui-1.8.4.custom.css') }}" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="{{ asset('bundles/alidatatable/js/jquery.js') }}"></script>
<script type="text/javascript" src="{{ asset('bundles/alidatatable/js/jquery.datatable.inc.js') }}"></script>
<script type="text/javascript" src="{{ asset('bundles/alidatatable/js/jquery.dataTables.min.js') }}"></script>    

{{ datatable({ 
        'edit_route' : 'RouteForYourEntity_edit',
        'delete_route' : 'RouteForYourEntity_delete',
        'js' : {
            'sAjaxSource' : path('RouteForYour_grid_action')
        }
    })
}}

高级使用datatable

# 高级php配置

假设上面的示例,您可以添加您的连接和where语句

/**
 * set datatable configs
 * 
 * @return \Ali\DatatableBundle\Util\Datatable
 */
private function _datatable()
{
    return $this->get('datatable')
                ->setEntity("XXXMyBundle:Entity", "x")                          // replace "XXXMyBundle:Entity" by your entity
                ->setFields(
                        array(
                            "Name"          => 'x.name',                        // Declaration for fields: 
                            "Adress"        => 'x.adress',                      //      "label" => "alias.field_attribute_for_dql"
                            "Group"         => 'g.name',
                            "Team"          => 't.name',
                            "_identifier_"  => 'x.id')                          // you have to put the identifier field without label. Do not replace the "_identifier_"
                        )
                ->addJoin('x.group', 'g', \Doctrine\ORM\Query\Expr\Join::INNER_JOIN)
                ->addJoin('x.team', 't', \Doctrine\ORM\Query\Expr\Join::INNER_JOIN)
                ->setWhere(                                                     // set your dql where statement
                     'x.adress = :adress',
                     array('adress' => 'Paris') 
                )
                ->setOrder("x.created", "desc")                                 // it's also possible to set the default order
                ->setHasAction(true);                                           // you can disable action column from here by setting "false".
}

# 使用搜索过滤器

全局激活搜索

过滤功能对于快速搜索数据库中的信息非常有用 - 然而,搜索只能以这种方式构建:单个列过滤。

默认情况下,过滤功能是禁用的,要使其工作,您只需从配置方法中激活它,如下所示

private function _datatable()
{
    return $this->get('datatable')
                //...
                ->setSearch(TRUE);
}
设置搜索字段

您可以设置您想启用搜索的字段,默认情况下,搜索不会在“操作”列中激活,但您可能想禁用其他列的搜索。假设您只想对“field1”和“field3”进行搜索,您只需为相应的列键激活搜索,并且您的datatable配置应该是

/**
 * set datatable configs
 * 
 * @return \Ali\DatatableBundle\Util\Datatable
 */
private function _datatable()
{
    $datatable = $this->get('datatable');
    return $datatable->setEntity("XXXMyBundle:Entity", "x")
                    ->setFields(
                            array(
                                "label of field1" => 'x.field1',   // column key 0
                                "label of field2" => 'x.field2',   // column key 1
                                "label of field3" => 'x.field3',   // column key 2
                                "_identifier_" => 'x.id')          // column key 3
                    )
                    ->setSearch(true)
                    ->setSearchFields(array(0,2))
    ;
}

# 多个操作

有时候,能够在多个记录上执行相同的操作,如删除、激活、移动等,是非常有用的。而将此功能添加到您的数据表中非常简单:您只需要按照以下方式声明您的多个操作。

/**
 * set datatable configs
 * 
 * @return \Ali\DatatableBundle\Util\Datatable
 */
private function _datatable()
{
    $datatable = $this->get('datatable');
    return $datatable->setEntity("XXXMyBundle:Entity", "x")
                    ->setFields(
                            array(
                                "label of field1" => 'x.field1',   // column key 0
                                "label of field2" => 'x.field2',   // column key 1
                                "_identifier_" => 'x.id')          // column key 2
                    )
                    ->setMultiple(
                                array(
                                    'delete' => array(
                                        'title' => 'Delete',
                                        'route' => 'multiple_delete_route' // path to multiple delete route
                                    )
                                )
                        )
    ;
}

接下来,您只需在您的“multiple_delete_route”(或您的路由)中添加必要的逻辑。在这个操作中,您可以通过以下方式获取选定的ID:

$data = $this->getRequest()->get('dataTables');
$ids  = $data['actions'];

自定义渲染器

Twig渲染器

为了设置自己的列结构,您可以使用以下自定义Twig渲染器:在这个示例中,您可以找到如何设置默认的Twig渲染器用于操作字段,您可以按需覆盖它。

/**
 * set datatable configs
 * 
 * @return \Ali\DatatableBundle\Util\Datatable
 */
private function _datatable()
{
    $datatable = $this->get('datatable');
    return $datatable->setEntity("XXXMyBundle:Entity", "x")
                    ->setFields(
                            array(
                                "label of field1" => 'x.field1',
                                "label of field2" => 'x.field2',
                                "_identifier_" => 'x.id')
                    )
                    ->setRenderers(
                            array(
                                2 => array(
                                    'view' => 'AliDatatableBundle:Renderers:_actions.html.twig',
                                    'params' => array(
                                            'edit_route'    => 'route_edit',
                                            'delete_route'  => 'route_delete',
                                            'delete_form_prototype'   => $datatable->getPrototype('delete_form')
                                        ),
                                ),
                            )
                    )
                    ->setHasAction(true);
}

PHP闭包

假设上述示例,您可以使用PHP闭包来设置您的自定义字段渲染器。

/**
 * set datatable configs
 * 
 * @return \Ali\DatatableBundle\Util\Datatable
 */
private function _datatable()
{
    $controller_instance = $this;
    return $this->get('datatable')
                ->setEntity("XXXMyBundle:Entity", "x")                          // replace "XXXMyBundle:Entity" by your entity
                ->setFields(
                        array(
                            "Name"          => 'x.name',                        // Declaration for fields: 
                            "Adress"        => 'x.adress',                      //      "label" => "alias.field_attribute_for_dql"
                            "_identifier_"  => 'x.id')                          // you have to put the identifier field without label. Do not replace the "_identifier_"
                        )
                ->setRenderer(
                    function(&$data) use ($controller_instance)
                    {
                        foreach ($data as $key => $value)
                        {
                            if ($key == 1)                                      // 1 => adress field
                            {
                                $data[$key] = $controller_instance
                                        ->get('templating')
                                        ->render(
                                               'XXXMyBundle:Module:_grid_entity.html.twig', 
                                               array('data' => $value)
                                        );
                            }
                        }
                    }
                )
                ->setOrder("x.created", "desc")                                 // it's also possible to set the default order
                ->setHasAction(true);                                           // you can disable action column from here by setting "false".
}
Screenshot

## 翻译

您可以通过以下方式添加到您的翻译目录中,以设置自己的翻译标签:

ali:
    common:
        action: Actions
        confirm_delete: 'Are you sure to delete this item ?'
        delete: delete
        edit: edit
        no_action: "(can't remove)"
        sProcessing: "Processing..."
        sLengthMenu: "Show _MENU_ entries"
        sZeroRecords: "No matching records found"
        sInfo: "Showing _START_ to _END_ of _TOTAL_ entries"
        sInfoEmpty: "Showing 0 to 0 of 0 entries"
        sInfoFiltered: "(filtered from _MAX_ total entries)"
        sInfoPostFix: ""
        sSearch: "Search:"
        sLoadingRecords: ""
        sFirst: "First"
        sPrevious: "Previous"  
        sNext: "Next"
        sLast: "Last"
        search: "Search"

此捆绑包包含九个翻译目录:阿拉伯语、中文、荷兰语、英语、西班牙语、法语、意大利语、俄语和土耳其语。要获取更多翻译条目,您可以参考官方的数据表翻译

## Doctrine查询构建器

要使用自己的查询对象提供给数据表对象,您可以使用您的“doctrine查询对象”执行此操作。AliDatatableBundle自1.2.0版本开始允许操作查询对象提供者,现在是一个doctrine查询构建器对象,您可以使用它来更新查询的所有组件,当然不包括所选字段部分。

这是使用Doctrine查询构建器的经典配置

private function _datatable()
{
    $datatable = $this->get('datatable')
                ->setEntity("XXXBundle:Entity", "e")
                ->setFields(
                        array(
                            "column1 label" => 'e.column1',
                            "_identifier_" => 'e.id')
                        )
                ->setWhere(
                    'e.column1 = :column1',
                    array('column1' => '1' )
                )
                ->setOrder("e.created", "desc");

     $qb = $datatable->getQueryBuilder()->getDoctrineQueryBuilder(); 
     // This is the doctrine query builder object , you can 
     // retrieve it and include your own change 

     return $datatable;
}

这是使用Doctrine查询对象(查询构建器)的配置

private function _datatable()
{
    $qb = $this->getDoctrine()->getEntityManager()->createQueryBuilder();
    $qb->from("XXXBundle:Entity", "e")
       ->where('e.column1 = :column1')
       ->setParameters(array('column1' = 0))
       ->orderBy("e.created", "desc");

    $datatable = $this->get('datatable')
                ->setFields(
                        array(
                            "Column 1 label" => 'e.column1',
                            "_identifier_" => 'e.id')
                        );

    $datatable->getQueryBuilder()->setDoctrineQueryBuilder($qb);

    return $datatable;
}

## 在同一视图中使用多个数据表

要在同一视图中声明多个数据表,您必须在控制器中使用“setDatatableId”设置数据表标识符:您的每个数据表配置方法(_datatable(),_datatable_1() .. _datatable_n())需要设置与您的视图中相同的标识符。

在控制器中

protected function _datatable() 
{
    // ...
    return $this->get('datatable')
                ->setDatatableId('dta-unique-id_1')
                ->setEntity("XXXMyBundle:Entity", "x")
    // ...
}

protected function _datatableSecond() 
{
    // ...
    return $this->get('datatable')
                ->setDatatableId('dta-unique-id_2')
                ->setEntity("YYYMyBundle:Entity", "y")
    // ...
}

在视图中

{{ 
    datatable({ 
        'id' : 'dta-unique-id_1',
        ...
            'js' : {
            'sAjaxSource' : path('RouteForYour_grid_action_1')
            }
    }) 
}}

{{ 
    datatable({ 
        'id' : 'dta-unique-id_2',
        ...
        'js' : {
            'sAjaxSource' : path('RouteForYour_grid_action_2')
        }
    }) 
}}