Datatable is not loading

[tamalmcp]

Datatable is not loading. If I remove 'columns' option, then just load the datatable without data. How could I display data to my datatable

$this->DataTables->init([
        'ajax' => [
            'url' => $this->Url->build() 
        ],
        'data' => $data,
        'deferLoading' => $data->count(), 

        'columns' => [
            [
                'name' => 'Products.id',
                'data' => 'id',
                'orderable' => false
            ],
            [
                'name' => 'Products.title',
                'data' => 'title'
            ],
            [
                'name' => 'Products.title',
                'data' => 'title'
            ],
            [
                'name' => 'Products.title',
                'data' => 'title'
            ],
            [
                'name' => 'Products.title',
                'data' => 'title'
            ],
        ],
        'order' => [0, 'desc'],
        'lengthChange' => false
    ]);
    echo $this->DataTables->draw('#dataTable');

[ypnos-web]

Did you check for any errors from DataTables, e.g. in the javascript console? How does your <table> look like? As you are using draw() instead of table() I assume you have an HTML table.

Need more information to help with this problem!

[tamalmcp]

@ypnos-web thanks for the response. I solved this issue. I changed the location of 'dataTables.bootstrap.min.js' and 'jquery.dataTables.min.js'. Now I am able to pass data through 'columns'. But another probleme has arise. searching, paging is not working. When I click on page number or write something to the search box, the following alert message shows:

DataTables warning: table id=dataTable - Ajax error. For more information about this error, please see http://datatables.net/tn/7

after inspect I got the following error message return to the browser:

Error: Column ordering requested, but no column definitions provided.

Here is the full code I posted brfore solve the previous probleme:

https://stackoverflow.com/q/47663397/3278639

[ypnos-web]

I suggest you follow the tutorial, see https://github.com/ypnos-web/cakephp-datatables/wiki/Quick-Start#enable-dynamic-filters-and-ordering

Btw. if you have a look at the -devel branch there is some new pretty neat functionality that assists in building column definitions in controller and view.

[tamalmcp]

@ypnos-web table method is not working in my view. I followed https://github.com/ypnos-web/cakephp-datatables/wiki/Quick-Start#enable-dynamic-filters-and-ordering

and use draw method instead of table. Now datatable is loading with data. But when I click on page number or write something to the search box, again it shows another alert message:

DataTables warning: table id=dataTable - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1

Now I go to Inspect Element->Network->Headers to the browser and copy the Request URL and then browse the Request URL, it shows the expected result without any error. But the following error shows to the browser's Inspect Element->Network->Response: SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data

Here is my latest code: Controller:

      public function index()
    {
        $columns = [
            [
                'field' => 'Products.id',
                'data' => 'id',
                'searchable' => false,
            ],            
            [
                'title' => __('Title'),
                'field' => 'Products.title',
                'data' => 'title'
            ],
            [
                'title' => __('Description'),
                'field' => 'Products.description',
                'data' => 'description',
            ],
            [
                'title' => __('Image'),
                'field' => 'Products.image',
                'data' => 'image'
            ],
            [
                'title' => __('Actions'),
                'field' => 'Products.id',
                'data' => 'id'
            ],
        ];

        $data = $this->DataTables->find('Products', 'all', ['conditions'=>[], 'order'=>'Products.id desc'], $columns);

        $this->set('columns', $columns);
        $this->set('data', $data);
        $this->set('_serialize', array_merge($this->viewVars['_serialize'], ['data']));
    }

view file:

<?php $this->start('scriptInline'); ?>
<script type="text/javascript">    
    <?php    
    $options = [
        'ajax' => [
        'url' => $this->Url->build() // current controller, action, params
    ],
    'data' => $data,
    'deferLoading' => $data->count(), // https://datatables.net/reference/option/deferLoading
    'columns' => $columns,
    'order' => [3, 'asc'], // order by username
    ];
    echo $this->DataTables->draw('#dataTable', $options, ['class' => 'table table-striped']);
    ?>
</script>
<?php $this->end(); ?>

[ypnos-web]

I don't really understand but it seems you found a bug. Could you please do the following:

1. Open the developer tools (press F11 or use 'Inspect Element')
2. Go to Network tab
3. Reload the page
4. Now perform an action on the table, e.g. click on page number
5. In the developer tools Networking tab, you should now see the last request
6. Select the request and view response (not response preview). Paste the response here.

[tamalmcp]

I explained it to the previous comment. It shows SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data

[ypnos-web]

You need to see the response in raw form without it being parsed by the browser. If you can't do that with Firefox, maybe try Chromium.

[tamalmcp]

Tested to Chromium. Nothing got in response.

[ypnos-web]

It is highly unlikely that a bug in this plugin leads to an empty response. JSON handling is done by CakePHP.

I would really like to track this problem down with you. I went through the code you posted several times and do not see the problem.

I suggest you use a debugger like Xdebug or use the History tab in CakePHP debug_kit to check View variables of the AJAX request etc.

[tamalmcp]

Ok, I will. And thanks again for your cooperation.

[tamalmcp]

I tested it to another new cakephp project. And it worked fine. May be it is conflicting with another plugin in my project. There is no bug with this plugin.

[mikk0s]

Just want to let you know that this plugin has some sort of conflict with Maicon Pinto's AdminLTE plugin; the json response actually returns the full page html in json instead of the datatables json only.

I was able to fix this by adding a beforeRender function to the controller: Source: https://stackoverflow.com/a/50349379 public function beforeRender(\Cake\Event\Event $event) { parent::beforeRender($event); if ($this->getRequest()->is('ajax') || $this->getRequest()->is('json')){ $this->viewBuilder()->setClassName('Json'); } }