Why isn't the search function on my datatables.js working?
Question
I'm making a CakePHP 2.x app and installed datatables.js following the instructions on the website, but although it's there some of the features aren't working. I can't change the amount of entries to display, the search function always returns nothing and it won't split the data into multiple pages (eg if I have it set to display 10 entries per page, it'll still display them all on one page even if it's exceeding 10).
The only parts that work are the sorting features and the visual aspect of it.
Here's a view that I've implemented datatables on:
<div class="products index">
<h2><?php echo __('Products'); ?></h2>
<table cellpadding="0" cellspacing="0" id="prod-tbl">
<thead>
<head>
<!--<script src="jquery-1.11.1.min.js"></script>-->
<!-- DataTables CSS -->
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.3/css/jquery.dataTables.css">
<!-- jQuery -->
<script type="text/javascript" charset="utf8" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<!-- DataTables -->
<script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.3/js/jquery.dataTables.js"></script>
<script >$(document).ready( function () {$('#prod-tbl').DataTable();} );</script>
</head>
<tr>
<th><?php echo $this->Paginator->sort('name'); ?></th>
<th><?php echo $this->Paginator->sort('product_code'); ?></th>
<th><?php echo $this->Paginator->sort('image_name'); ?></th>
<th><?php echo $this->Paginator->sort('image_url'); ?></th>
<!--<th><?php echo $this->Paginator->sort('brand_id'); ?></th>
<th><?php echo $this->Paginator->sort('reward_id'); ?></th>-->
<th><?php echo $this->Paginator->sort('product_status_id'); ?></th>
<th><?php echo $this->Paginator->sort('serial_id'); ?></th>
<th><?php echo $this->Paginator->sort('category_id'); ?></th>
<th class="actions"><?php echo __('Actions'); ?></th>
</tr>
</thead>
<?php foreach ($products as $product): ?>
<tbody>
<tr>
<td><?php echo h($product['Product']['name']); ?> </td>
<td><?php echo h($product['Product']['product_code']); ?> </td>
<td><?php echo h($product['Product']['image_name']); ?> </td>
<td><?php echo h($product['Product']['image_url']); ?> </td>
<!--<td><?php echo h($product['Product']['brand_id']); ?> </td>
<td><?php echo h($product['Product']['reward_id']); ?> </td>-->
<td><?php echo h($product['Product']['product_status_id']); ?> </td>
<td><?php echo h($product['Product']['serial_id']); ?> </td>
<td><?php echo h($product['Product']['category_id']); ?> </td>
<td class="actions">
<?php echo $this->Html->link(__('View'), array('action' => 'view', $product['Product']['id'])); ?>
<?php echo $this->Html->link(__('Edit'), array('action' => 'edit', $product['Product']['id'])); ?>
<?php echo $this->Form->postLink(__('Delete'), array('action' => 'delete', $product['Product']['id']), null, __('Are you sure you want to delete # %s?', $product['Product']['id'])); ?>
</td>
</tr>
</tbody>
<?php endforeach; ?>
</table>
<p>
<?php
echo $this->Paginator->counter(array(
'format' => __('Page {:page} of {:pages}, showing {:current} records out of {:count} total, starting on record {:start}, ending on {: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>
<div class="actions">
<h3><?php echo __('Actions'); ?></h3>
<ul>
<li><?php echo $this->Html->link(__('New Product'), array('action' => 'add')); ?></li>
</ul>
</div>
1 answers
solution1
1 ACCPTED 2014-10-20 11:09:16
I guess you are trying to include datatable.js in a CakePHP paginated page.
Both datatable.js and CakePHP Paginator are two different methods to filter out data. Cake Paginator does all types of filtering in server and displays only resultant data in the table. Datatable.js works in client(javascript).
When you apply datatable.js over paginated table, it will filter the resultant data only, not the entire data.
You can use any of the following 2 methods
- Make use of datatable server side processing (Matt Hughes has written a good documentation for CakePHP here https://datatables.net/development/server-side/php_cake )
- Use a CakePHP datatable component. (One like https://github.com/cnizzdotcom/cakephp-datatable )
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.