CakePHP Ajax分页(CakePHP Ajax Pagination)

CakePHP Ajax分页(CakePHP Ajax Pagination)

我目前正在尝试获取ajax分页列表。 我想我很亲密。 当我单击Previous，Next或单个页码时，正确的结果显示但div.postsPaging加载了分页结果以及Cake的default.ctp布局的页眉和页脚。 我已尝试在displayPosts视图或displayPosts操作中将布局设置为ajax，但默认布局根本不显示（在div内部或外部）。

我的问题是，如何只使用分页结果而不是页眉，页脚或布局中的任何其他内容来加载postsPaging div。 如何让ajax请求的结果不包括默认布局的页眉和页脚？

附加到其中一个页面索引和Next按钮的jQuery事件是：

$("#link-196981051").bind("click", function (event) {$.ajax({dataType:"html", success:function (data, textStatus) {$("#postsPaging").html(data);}, url:"\/AuthAdminCakeApp\/posts\/displayPosts\/page:2"}); return false;});` $("#link-296431922").bind("click", function (event) {$.ajax({dataType:"html", success:function (data, textStatus) {$("#postsPaging").html(data);}, url:"\/AuthAdminCakeApp\/posts\/displayPosts\/page:2"}); return false;});`

我的PostsController代码如下所示：

class PostsController extends AppController { public $helpers = array('Js' => 'Jquery'); public $paginate = array( 'limit' => 3, 'order' => array( 'Post.title' => 'asc' ) ); public function displayPosts() { $this->set('posts', $this->paginate()); } // other actions }

我的分页元素（paging.ctp）如下所示：

<?php $this->Paginator->options( array('update'=>'#postsPaging', 'url'=>array('controller'=>'posts', 'action'=>'displayPosts'))); ?> <table cellpadding="0" cellspacing="0"> <tr> <th><?php echo $this->Paginator->sort('id'); ?></th> <th><?php echo $this->Paginator->sort('user_id'); ?></th> <th><?php echo $this->Paginator->sort('title'); ?></th> <th><?php echo $this->Paginator->sort('body'); ?></th> <th><?php echo $this->Paginator->sort('created'); ?></th> <th><?php echo $this->Paginator->sort('modified'); ?></th> <th class="actions"><?php echo __('Actions'); ?></th> </tr> <?php foreach ($posts as $post): ?> <tr> <td><?php echo h($post['Post']['id']); ?>&nbsp;</td> <td> <?php echo $this->Html->link($post['User']['id'], array('controller' => 'users', 'action' => 'view', $post['User']['id'])); ?> </td> <td><?php echo h($post['Post']['title']); ?>&nbsp;</td> <td><?php echo h($post['Post']['body']); ?>&nbsp;</td> <td><?php echo h($post['Post']['created']); ?>&nbsp;</td> <td><?php echo h($post['Post']['modified']); ?>&nbsp;</td> <td class="actions"> <?php echo $this->Html->link(__('View'), array('action' => 'view', $post['Post']['id'])); ?> <?php echo $this->Html->link(__('Edit'), array('action' => 'edit', $post['Post']['id'])); ?> <?php echo $this->Form->postLink(__('Delete'), array('action' => 'delete', $post['Post']['id']), null, __('Are you sure you want to delete # %s?', $post['Post']['id'])); ?> </td> </tr> <?php endforeach; ?> </table> <?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')); ?>

displayPosts操作的视图如下所示：

<div id="postsPaging"> <?php echo $this->element('Posts/paging'); ?> </div>

编辑：我正在使用CakePHP 2.2.5。

I am currently trying to get an ajax paginated list working. I think I'm close. When I click on the Previous, Next or individual page numbers, the correct results show but div.postsPaging is loaded with the paginated results along with Cake's default.ctp layout's header and footer. I've tried setting the layout to ajax in the displayPosts view or in the displayPosts action, but then the default layout doesn't appear at all (either inside or outside the div).

My question is, how can I load the postsPaging div with just the paginated results and not the header, footer or anything else in the layout. How can I get the results of the ajax request to not include the header and footer of the default layout?

The jQuery events attached to one of the page indexes and the Next button are:

$("#link-196981051").bind("click", function (event) {$.ajax({dataType:"html", success:function (data, textStatus) {$("#postsPaging").html(data);}, url:"\/AuthAdminCakeApp\/posts\/displayPosts\/page:2"}); return false;});` $("#link-296431922").bind("click", function (event) {$.ajax({dataType:"html", success:function (data, textStatus) {$("#postsPaging").html(data);}, url:"\/AuthAdminCakeApp\/posts\/displayPosts\/page:2"}); return false;});`

My PostsController code looks like this:

class PostsController extends AppController { public $helpers = array('Js' => 'Jquery'); public $paginate = array( 'limit' => 3, 'order' => array( 'Post.title' => 'asc' ) ); public function displayPosts() { $this->set('posts', $this->paginate()); } // other actions }

My paging element (paging.ctp) looks like this:

<?php $this->Paginator->options( array('update'=>'#postsPaging', 'url'=>array('controller'=>'posts', 'action'=>'displayPosts'))); ?> <table cellpadding="0" cellspacing="0"> <tr> <th><?php echo $this->Paginator->sort('id'); ?></th> <th><?php echo $this->Paginator->sort('user_id'); ?></th> <th><?php echo $this->Paginator->sort('title'); ?></th> <th><?php echo $this->Paginator->sort('body'); ?></th> <th><?php echo $this->Paginator->sort('created'); ?></th> <th><?php echo $this->Paginator->sort('modified'); ?></th> <th class="actions"><?php echo __('Actions'); ?></th> </tr> <?php foreach ($posts as $post): ?> <tr> <td><?php echo h($post['Post']['id']); ?>&nbsp;</td> <td> <?php echo $this->Html->link($post['User']['id'], array('controller' => 'users', 'action' => 'view', $post['User']['id'])); ?> </td> <td><?php echo h($post['Post']['title']); ?>&nbsp;</td> <td><?php echo h($post['Post']['body']); ?>&nbsp;</td> <td><?php echo h($post['Post']['created']); ?>&nbsp;</td> <td><?php echo h($post['Post']['modified']); ?>&nbsp;</td> <td class="actions"> <?php echo $this->Html->link(__('View'), array('action' => 'view', $post['Post']['id'])); ?> <?php echo $this->Html->link(__('Edit'), array('action' => 'edit', $post['Post']['id'])); ?> <?php echo $this->Form->postLink(__('Delete'), array('action' => 'delete', $post['Post']['id']), null, __('Are you sure you want to delete # %s?', $post['Post']['id'])); ?> </td> </tr> <?php endforeach; ?> </table> <?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')); ?>

The view for the displayPosts action looks like this:

<div id="postsPaging"> <?php echo $this->element('Posts/paging'); ?> </div>

Edit: I'm using CakePHP 2.2.5.

最满意答案

你必须使用ajax布局。

$this->layout = ($this->request->is("ajax")) ? "ajax" : "default";

您还可以将此代码段放在AppController中，以用于应用程序范围内的Ajax响应。

public function beforeRender() { $this->layout = ($this->request->is("ajax")) ? "ajax" : "default"; }

you have to use an ajax layout.

$this->layout = ($this->request->is("ajax")) ? "ajax" : "default";

You can also place this code snippet in AppController, for Ajax responses application wide.

public function beforeRender() { $this->layout = ($this->request->is("ajax")) ? "ajax" : "default"; }