I'm trying to use JQuery's DataTable server-side with CakePHP but I'm not getting it. I'm looking for some example for this but I have not found it yet. When executing the JQuery of DataTable it returns an error: Uncaught TypeError: Cannot read property 'length' of undefined
How to use JQuery DataTable with CakePHP?
I'm trying like this.
index.ctp
<script type="text/javascript">
//datatable
$(document).ready(function() {
$('#dataTables-example').DataTable({
"processing": true,
"serverSide": true,
"ajax": "<?php echo $this->Html->url("/Empresas/indexAjax.json")?>"
});
});
</script>
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">Empresa</h1>
<!--loading-->
<div class="imageLoading" style="display: none">
<?php echo $this->Html->image("ajax-loader.gif", array("height"=>"32", "width"=>"32"));?>
</div>
<!--/loading-->
<span><?php echo $this->Html->link(__('Novo'), array('action' => 'add')); ?></span>
<div class="panel panel-default">
<!-- /.panel-heading -->
<div class="panel-body">
<div class="dataTable_wrapper">
<table class="table table-striped table-bordered table-hover" id="dataTables-example">
<thead>
<th><?php echo $this->Paginator->sort('id'); ?></th>
<th><?php echo $this->Paginator->sort('nomeFantasia'); ?></th>
<th><?php echo $this->Paginator->sort('cnpj'); ?></th>
<th><?php echo $this->Paginator->sort('telefone1'); ?></th>
<th><?php echo $this->Paginator->sort('telefone2'); ?></th>
<th><?php echo $this->Paginator->sort('celular'); ?></th>
<th><?php echo $this->Paginator->sort('aberto'); ?></th>
<th class="actions"><?php echo __('Actions'); ?></th>
</thead>
<tbody>
</tbody>
</table>
<p>
<?php
echo $this->Paginator->counter(array(
'format' => __('Página {:page} de {:pages}, exibindo {:current} registro de {:count}, início {:start}, final {:end}')
));
?> </p>
<div class="paging">
<?php
echo $this->Paginator->prev('< ' . __(' previous '), array(), null, array('class' => 'prev disabled'));
echo $this->Paginator->numbers(array('separator' => ''));
echo $this->Paginator->next(__(' next ') . ' >', array(), null, array('class' => 'next disabled'));
?>
</div>
</div>
<!-- /.panel-body -->
</div>
<!-- /.panel -->
</div>
<!-- /.col-lg-12 -->
</div>
</div>
controller
public function indexAjax() {
$this->autoRender = false;
$id = $this->Auth->user("id");
$this->Empresa->recursive = 0;
$this->paginate = array(
'Empresa'=>array('conditions'=>array("users_id = "=> $id))
);
$empresas = $this->paginate('Empresa');
//debug($empresas) or die;
return json_encode($empresas);
}