Using Chumper Datatable in Laravel 5


Chumper have been so far the best package that was available for Laravel 4 to use Datatable jquery plugin. In order to use it with Laravel 5 , you can do following quick changes to code.

1) In composer.json add "chumper/datatable": "dev-master" in "require-dev".

2) Execute Composer install from command prompt , that will add the necessary files in vendor directory. If its not downloading directly make sure you remove your composer.lock file and execute the command again.

3) In config/app.php
Add 'Chumper\Datatable\DatatableServiceProvider' to providers array
Add 'Datatable' => 'Chumper\Datatable\Facades\DatatableFacade', to aliases array

4) In vendor\chumper\datatable\src\config\config.php
Update
'table_view' => 'Chumper::views.template',
'script_view' => 'Chumper::views.javascript',


5) In vendor/chumper/datatable/src/Chumper/Datatable/DatatableServiceProvider.php
Update your Boot and Register functions to following

public function boot()
    {

        $viewPath = __DIR__.'/../../views/';
        $this->loadViewsFrom($viewPath, 'Chumper');
        //$this->package('chumper/datatable');
        $this->publishes([
             $viewPath => base_path('resources/views/vendor/Chumper'),
        ]);

    }

public function register()
    {
     
        $configPath = __DIR__.'/../../config/config.php';
        $this->publishes([$configPath => config_path('chumper_datatable.php'),]);
        $this->mergeConfigFrom($configPath, 'chumper_datatable');

        $this->app['datatable'] = $this->app->share(function($app)
        {
            return new Datatable;
        });
    }

Then execute php artisan vendor:publish --force from command prompt.
This will copy chumper config file to app config directory.  Also it will copy chumper view files to app view directory which is resources.

6) In vendor/chumper/datatable/src/Chumper/Datatable/Table.php
Update constructor to load config file from new location.
$this->config = Config('chumper_datatable.table');


7) Update resources\views\vendor\Chumper\views\javascript.blade.php with following code

<script type="text/javascript">
    jQuery(document).ready(function(){

        // dynamic table
        oTable = jQuery('#{{ $id }}').dataTable({
            "sPaginationType": "full_numbers",
            "bProcessing": false,
        @foreach ($options as $k => $o)
            {!! json_encode($k) !!}: {!! json_encode($o) !!},
        @endforeach

        @foreach ($callbacks as $k => $o)
            {!! json_encode($k) !!}: {!! $o !!},
        @endforeach

        });
     
oTable.addClass('table-striped ');
   
    });
</script>


Thats it and call it in the controller file as old chumper documentation and it shall work , the usage documentation can be found it:

Feel free to leave your queries and comments.

Thanks.





Comments

  1. in 7) Update resources\views\vendor\Chumper\views\javascript.blade.php
    is it meant to be a the 'Chumper\views\javascript.blade.php?
    There is no views directory there, create one or is it a typo?

    ReplyDelete
  2. Will this work with the latest stable Datatables v1.10.5 or only with 1.9?

    ReplyDelete
  3. This solution does not work. Need to wait for proper solution.

    ReplyDelete
  4. This comment has been removed by the author.

    ReplyDelete
  5. it works but changing some

    step 4:
    'table_view' => 'Chumper::template',
    'script_view' => 'Chumper::javascript',

    and at template.blade.php
    at last lines:

    @if (!$noScript)
    @include(Config::get('chumper_datatable.table.script_view'), array('id' => $id, 'options' => $options, 'callbacks' => $callbacks))
    @endif

    and to render view use {!! ..... !!}}

    ReplyDelete
  6. Please use require "chumper/datatable": "l5-dev as 2.3" in your composer.json to avoid updates in your code when you use the 'dev' version. Otherwise you need to change you code everytime you do an update.

    ReplyDelete
  7. i got json output:

    {"aaData":[["primary_dpt","department 1"],["primary_dpt","department 1"],["primary_dpt","department 1"]],"sEcho":0,"iTotalRecords":3,"iTotalDisplayRecords":3,"aaAdditional":null}

    ReplyDelete
  8. and also shows table with only title; no field is not rendering at respective field :-(

    Please help me

    ReplyDelete
  9. This comment has been removed by the author.

    ReplyDelete
  10. I really appreciate your work and it is quite informative post thank you. Hire Laravel Developer

    ReplyDelete
  11. Love it! I like this topic.This site has lots of advantage.I found many interesting things from this site. It helps me in many ways.Thanks for posting this again. Thanks a million and please keep up the effective work Thank yo so much for sharing this kind of info- laravel application development

    ReplyDelete

Post a Comment